WebVTT: The Web Video Text Tracks Format DIFF file

Files changed (1) hide show

{../2017-08-08 → .}/Overview.html +1579 -1211

{../2017-08-08 → .}/Overview.html RENAMED

@@ -1210,6 +1210,9 @@
      color: inherit;
    }
  </style>
+  <link href="https://www.w3.org/StyleSheets/TR/2016/W3C-CR" rel="stylesheet" type="text/css">
+  <meta content="Bikeshed version 5dff6b06be1856d0a5e62cf40e9cc21c06bfb098" name="generator">
+  <link href="https://www.w3.org/TR/webvtt1/" rel="canonical">
 <style>
  samp {
    font-family: inherit;
@@ -1218,6 +1221,10 @@
    outline: 0.18em solid rgba(0, 0, 0, 0.7);
    color: white;
  }
+            +
+ [data-algorithm]:not(.heading) {
+   padding-left: 2em;
+ }
 </style>
 <style>/* style-md-lists */
@@ -1461,31 +1468,27 @@
 .highlight .vi { color: #0077aa } /* Name.Variable.Instance */
 .highlight .il { color: #000000 } /* Literal.Number.Integer.Long */
 </style>
-            -
-<link href="https://www.w3.org/StyleSheets/TR/2016/W3C-WD" rel="stylesheet" type="text/css">
-<meta content="Bikeshed version 98d39f855addd7fd56ede57e54c21835cb0ff7de" name="generator">
-<link href="https://www.w3.org/TR/webvtt1/" rel="canonical">
-            -
  <body class="h-entry">
   <div class="head">
    <p data-fill-with="logo"><a class="logo" href="https://www.w3.org/"> <img alt="W3C" height="48" src="https://www.w3.org/StyleSheets/TR/2016/logos/W3C" width="72"> </a> </p>
    <h1 class="p-name no-ref" id="title">WebVTT: The Web Video Text Tracks Format</h1>
-   <h2 class="no-num no-toc no-ref heading settled" id="subtitle"><span class="content">W3C Working Draft <time class="dt-updated" datetime="2017-08-08">08 August 2017</time></span></h2>
+   <h2 class="no-num no-toc no-ref heading settled" id="subtitle"><span class="content">W3C Candidate Recommendation <time class="dt-updated" datetime="2018-04-15">15 April 2018</time></span></h2>
    <div data-fill-with="spec-metadata">
     <dl>
      <dt>This version:
-     <dd><a class="u-url" href="https://www.w3.org/TR/2017/WD-webvtt1-20170808/">https://www.w3.org/TR/2017/WD-webvtt1-20170808/</a>
+     <dd><a class="u-url" href="https://www.w3.org/TR/2018/CR-webvtt1-20180415/">https://www.w3.org/TR/2018/CR-webvtt1-20180415/</a>
      <dt>Latest published version:
      <dd><a href="https://www.w3.org/TR/webvtt1/">https://www.w3.org/TR/webvtt1/</a>
      <dt>Editor's Draft:
      <dd><a href="https://w3c.github.io/webvtt/">https://w3c.github.io/webvtt/</a>
      <dt>Previous Versions:
-     <dd><a href="https://www.w3.org/TR/2017/WD-webvtt1-20170713/" rel="prev">https://www.w3.org/TR/2017/WD-webvtt1-20170713/</a>
+     <dd><a href="https://www.w3.org/TR/2017/WD-webvtt1-20170808/" rel="prev">https://www.w3.org/TR/2017/WD-webvtt1-20170808/</a>
      <dt>Test Suite:
      <dd><a href="https://github.com/w3c/web-platform-tests/tree/master/webvtt">https://github.com/w3c/web-platform-tests/tree/master/webvtt</a>
      <dt class="editor">Editor:
-     <dd class="editor p-author h-card vcard"><a class="p-name fn u-email email" href="mailto:simonp@opera.com" data-editor-id="simonp">Simon Pieters</a> (<a class="p-org org" href="http://www.opera.com/">Opera Software ASA</a>)
+     <dd class="editor p-author h-card vcard"><a class="p-name fn u-email email" href="mailto:silvia.pfeiffer@data61.csiro.au">Silvia Pfeiffer</a> (<a class="p-org org" href="https://www.csiro.au/">CSIRO</a>)
      <dt class="editor">Former Editors:
+     <dd class="editor p-author h-card vcard"><a class="p-name fn u-email email" href="mailto:simonp@opera.com">Simon Pieters</a> (<a class="p-org org" href="http://www.opera.com/">Opera Software AS</a>)
      <dd class="editor p-author h-card vcard"><a class="p-name fn u-email email" href="mailto:silviapfeiffer1@gmail.com">Silvia Pfeiffer</a> (<a class="p-org org" href="http://nicta.com.au/">NICTA</a>)
      <dd class="editor p-author h-card vcard"><a class="p-name fn u-email email" href="mailto:philipj@opera.com">Philip Jägenstedt</a> (<a class="p-org org" href="http://www.opera.com/">Opera Software ASA</a>)
      <dd class="editor p-author h-card vcard"><a class="p-name fn u-email email" href="mailto:ian@hixie.ch">Ian Hickson</a> (<a class="p-org org" href="http://www.google.com/">Google</a>)
@@ -1497,7 +1500,7 @@
     </dl>
    </div>
    <div data-fill-with="warning"></div>
-   <p class="copyright" data-fill-with="copyright"><a href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright">Copyright</a> © 2011-2017 <a href="http://www.w3.org/"><abbr title="World Wide Web Consortium">W3C</abbr></a><sup>®</sup> (<a href="http://www.csail.mit.edu/"><abbr title="Massachusetts Institute of Technology">MIT</abbr></a>, <a href="http://www.ercim.eu/"><abbr title="European Research Consortium for Informatics and Mathematics">ERCIM</abbr></a>, <a href="http://www.keio.ac.jp/">Keio</a>, <a href="http://ev.buaa.edu.cn/">Beihang</a>).
+   <p class="copyright" data-fill-with="copyright"><a href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright">Copyright</a> © 2011-2018 <a href="http://www.w3.org/"><abbr title="World Wide Web Consortium">W3C</abbr></a><sup>®</sup> (<a href="http://www.csail.mit.edu/"><abbr title="Massachusetts Institute of Technology">MIT</abbr></a>, <a href="http://www.ercim.eu/"><abbr title="European Research Consortium for Informatics and Mathematics">ERCIM</abbr></a>, <a href="http://www.keio.ac.jp/">Keio</a>, <a href="http://ev.buaa.edu.cn/">Beihang</a>).
 W3C <a href="http://www.w3.org/Consortium/Legal/ipr-notice#Legal_Disclaimer">liability</a>, <a href="http://www.w3.org/Consortium/Legal/ipr-notice#W3C_Trademarks">trademark</a> and <a href="http://www.w3.org/Consortium/Legal/copyright-documents">document use</a> rules apply. </p>
    <hr title="Separator for header">
   </div>
@@ -1509,33 +1512,64 @@
   </div>
   <h2 class="no-num no-toc no-ref heading settled" id="status"><span class="content">Status of this document</span></h2>
   <div data-fill-with="status">
-   <p> <em>This section describes the status of this document at the time of
-  its publication. Other documents may supersede this document. A list of
-  current W3C publications and the latest revision of this technical report
-  can be found in the <a href="https://www.w3.org/TR/">W3C technical reports
+            +
+<p> <em>This section describes the status of this document at the time of its publication. Other
+documents may supersede this document. A list of current W3C publications and the latest revision
+of this technical report can be found in the <a href="https://www.w3.org/TR/">W3C technical reports
   index at https://www.w3.org/TR/.</a></em> </p>
-   <p>Work on this specification is being undertaken both in the <a href="https://www.w3.org/community/texttracks/">Web Media Text Tracks Community Group</a> as well as
-in the <a href="https://www.w3.org/AudioVideo/TT/"><abbr title="World Wide Web Consortium">W3C</abbr> Timed Text Working Group</a>. The latter group works towards a <abbr title="World Wide Web Consortium">W3C</abbr> Recommendation for reference purposes with
-interoperability requirements, while the former is a Draft Community Group Report that continues to
-evolve. </p>
-   <p>This document was published by the <a href="https://www.w3.org/AudioVideo/TT/"><abbr title="World Wide Web Consortium">W3C</abbr> Timed
-Text Working Group</a> as a Working Draft. This document is intended to become a <abbr title="World Wide Web Consortium">W3C</abbr> Recommendation. If you wish to make comments regarding
-this document, please send them to <a href="mailto:public-tt@w3.org?subject=%5Bwebvtt%5D">public-tt@w3.org</a> (<a href="mailto:public-tt-request@w3.org?subject=subscribe">subscribe</a>, <a href="http://lists.w3.org/Archives/Public/public-tt/">archives</a>) with <code>[webvtt]</code> at
-the start of your email’s subject. All comments are welcome. </p>
-<p>The Timed Text Working Group intends to recommend transition of this document to Candidate Recommendation and is offering this Working Draft for a public review period ending on 22 September 2017. A cumulative summary of all changes applied to this version since <a href="http://www.w3.org/TR/2014/WD-webvtt1-20141113/">WebVTT First Public Working Draft</a> was published is available at <a href="changes-FPWD.html">Changes from WebVTT (FPWD)</a>.
-</p>
-   <p> Publication as a Working Draft does not imply endorsement by the W3C
-  Membership. This is a draft document and may be updated, replaced or
-  obsoleted by other documents at any time. It is inappropriate to cite this
+<p>Work on this specification is being undertaken both in the
+<a href="https://www.w3.org/community/texttracks/">Web Media Text Tracks Community Group</a>
+as well as in the <a href="https://www.w3.org/AudioVideo/TT/">
+<abbr title="World Wide Web Consortium">W3C</abbr> Timed Text Working Group</a>. The latter group
+works towards a <abbr title="World Wide Web Consortium">W3C</abbr> Recommendation for reference
+purposes with interoperability requirements, while the former is a Draft Community Group Report
+that continues to evolve. </p>
+            +
+<p>This document was published by the <a href="https://www.w3.org/AudioVideo/TT/">
+<abbr title="World Wide Web Consortium">W3C</abbr> Timed Text Working Group</a> as a Working Draft.
+This document is intended to become a <abbr title="World Wide Web Consortium">W3C</abbr>
+Recommendation. If you wish to make comments regarding this document, please send them to
+<a href="mailto:public-tt@w3.org?subject=%5Bwebvtt%5D">public-tt@w3.org</a>
+(<a href="mailto:public-tt-request@w3.org?subject=subscribe">subscribe</a>,
+<a href="http://lists.w3.org/Archives/Public/public-tt/">archives</a>) with <code>[webvtt]</code>
+at the start of your email’s subject. All comments are welcome.
+<abbr title="World Wide Web Consortium">W3C</abbr> publishes a Candidate Recommendation to indicate
+that the document is believed to be stable and to encourage implementation by the developer
+community. This Candidate Recommendation is expected to advance to Proposed Recommendation no
+earlier than 15 July 2017. </p>
+            +
+<p>Please see the Working Group's <a href="https://www.w3.org/wiki/TimedText/WebVTT_Implementation_Report">Implementation Report</a>.</p>
+            +
+<p>For this specification to exit the CR stage, at least 2 independent implementations of every
+feature defined in this specification need to be documented in the implementation report. The
+implementation report is based on implementer-provided test results for the
+<a href="https://github.com/w3c/web-platform-tests/tree/master/webvtt">test suite</a>. The Working
+Group does not require that implementations are publicly available but encourages them to be so.</p>
+            +
+<p>The Working Group has not identified features "at risk" for this specification.</p>
+            +
+<p>A cumulative summary of all changes applied to this version since the
+<a href="https://www.w3.org/TR/2014/WD-webvtt1-20141113/">WebVTT First Public Working Draft</a>
+was published is available at <a href="https://www.w3.org/TR/2018/CR-webvtt1-20180415/changes.html">Changes from FPWD WebVTT</a>.</p>
+            +
+<p>For convenience, a complete diff between this version and the WebVTT previous Working Draft was published is found at <a href="https://www.w3.org/TR/2018/CR-webvtt1-20180415/diff.html">Diff from previsou Workdin Draft WebVTT</a>.</p>
+            +
+<p> Publication as a Candidate Recommendation does not imply endorsement by the
+<abbr title="World Wide Web Consortium">W3C</abbr> Membership. This is a draft document and may be
+updated, replaced or obsoleted by other documents at any time. It is inappropriate to cite this
   document as other than work in progress. </p>
+            +
    <p> This document was produced by a group operating under
     the <a href="https://www.w3.org/Consortium/Patent-Policy-20040205/">5 February 2004 W3C Patent Policy</a>.
-    W3C maintains a <a href="https://www.w3.org/2004/01/pp-impl/34314/status" rel="disclosure">public list of any patent disclosures</a> made in connection with the deliverables of the group;
+W3C maintains a <a href="https://www.w3.org/2004/01/pp-impl/49309/status" rel="disclosure">public list of any patent disclosures</a> made in connection with the deliverables of the group;
     that page also includes instructions for disclosing a patent.
+<abbr title="World Wide Web Consortium">W3C</abbr> maintains a <a href="https://www.w3.org/2004/01/pp-impl/34314/status">public list of any patent disclosures</a> made in connection with the
+deliverables of the group; that page also includes instructions for disclosing a patent.
     An individual who has actual knowledge of a patent which the individual believes contains <a href="https://www.w3.org/Consortium/Patent-Policy-20040205/#def-essential">Essential Claim(s)</a> must disclose the information in accordance with <a href="https://www.w3.org/Consortium/Patent-Policy-20040205/#sec-Disclosure">section 6 of the W3C Patent Policy</a>. </p>
+            +
    <p> This document is governed by the <a href="https://www.w3.org/2017/Process-20170301/" id="w3c_process_revision">1 March 2017 W3C Process Document</a>. </p>
-   <p></p>
+            +
   </div>
   <div class="snapshot" hidden="">
    <p>
@@ -1551,10 +1585,13 @@
     <li>
      <a href="#introduction"><span class="secno">1</span> <span class="content">Introduction</span></a>
      <ol class="toc">
-      <li><a href="#introduction-multiple-lines"><span class="secno">1.1</span> <span class="content">Cues with multiple lines</span></a>
-      <li><a href="#introduction-comments"><span class="secno">1.2</span> <span class="content">Comments</span></a>
-      <li><a href="#styling"><span class="secno">1.3</span> <span class="content">Styling</span></a>
-      <li><a href="#introduction-other-features"><span class="secno">1.4</span> <span class="content">Other features</span></a>
+      <li><a href="#introduction-caption"><span class="secno">1.1</span> <span class="content">A simple caption file</span></a>
+      <li><a href="#introduction-multiple-lines"><span class="secno">1.2</span> <span class="content">Caption cues with multiple lines</span></a>
+      <li><a href="#styling"><span class="secno">1.3</span> <span class="content">Styling captions</span></a>
+      <li><a href="#introduction-other-features"><span class="secno">1.4</span> <span class="content">Other caption and subtitling features</span></a>
+      <li><a href="#introduction-comments"><span class="secno">1.5</span> <span class="content">Comments in WebVTT</span></a>
+      <li><a href="#introduction-chapters"><span class="secno">1.6</span> <span class="content">Chapters example</span></a>
+      <li><a href="#introduction-metadata"><span class="secno">1.7</span> <span class="content">Metadata example</span></a>
      </ol>
     <li>
      <a href="#conformance"><span class="secno">2</span> <span class="content">Conformance</span></a>
@@ -1565,8 +1602,12 @@
     <li>
      <a href="#data-model"><span class="secno">3</span> <span class="content">Data model</span></a>
      <ol class="toc">
-      <li><a href="#cues"><span class="secno">3.1</span> <span class="content">WebVTT cues</span></a>
-      <li><a href="#regions"><span class="secno">3.2</span> <span class="content">WebVTT regions</span></a>
+      <li><a href="#model-overview"><span class="secno">3.1</span> <span class="content">Overview</span></a>
+      <li><a href="#model-cues"><span class="secno">3.2</span> <span class="content">WebVTT cues</span></a>
+      <li><a href="#cues"><span class="secno">3.3</span> <span class="content">WebVTT caption or subtitle cues</span></a>
+      <li><a href="#regions"><span class="secno">3.4</span> <span class="content">WebVTT caption or subtitle regions</span></a>
+      <li><a href="#chapter-cues"><span class="secno">3.5</span> <span class="content">WebVTT chapter cues</span></a>
+      <li><a href="#metadata-cues"><span class="secno">3.6</span> <span class="content">WebVTT metadata cues</span></a>
      </ol>
     <li>
      <a href="#syntax"><span class="secno">4</span> <span class="content">Syntax</span></a>
@@ -1576,7 +1617,8 @@
        <a href="#types-of-webvtt-cue-payload"><span class="secno">4.2</span> <span class="content">Types of WebVTT cue payload</span></a>
        <ol class="toc">
         <li><a href="#metadata-text"><span class="secno">4.2.1</span> <span class="content">WebVTT metadata text</span></a>
-        <li><a href="#cue-text"><span class="secno">4.2.2</span> <span class="content">WebVTT cue text</span></a>
+        <li><a href="#caption-text"><span class="secno">4.2.2</span> <span class="content">WebVTT caption or subtitle cue text</span></a>
+        <li><a href="#chapter-title-text"><span class="secno">4.2.3</span> <span class="content">WebVTT chapter title text</span></a>
        </ol>
       <li><a href="#region-settings"><span class="secno">4.3</span> <span class="content">WebVTT region settings</span></a>
       <li><a href="#cue-settings"><span class="secno">4.4</span> <span class="content">WebVTT cue settings</span></a>
@@ -1590,51 +1632,56 @@
        <ol class="toc">
         <li><a href="#file-using-metadata-content"><span class="secno">4.6.1</span> <span class="content">WebVTT file using metadata content</span></a>
         <li><a href="#file-using-chapter-title-text"><span class="secno">4.6.2</span> <span class="content">WebVTT file using chapter title text</span></a>
-        <li><a href="#file-using-cue-text"><span class="secno">4.6.3</span> <span class="content">WebVTT file using cue text</span></a>
+        <li><a href="#file-using-cue-text"><span class="secno">4.6.3</span> <span class="content">WebVTT file using caption or subtitle cue text</span></a>
        </ol>
      </ol>
     <li>
-     <a href="#parsing"><span class="secno">5</span> <span class="content">Parsing</span></a>
+     <a href="#default-classes"><span class="secno">5</span> <span class="content">Default classes for WebVTT Caption or Subtitle Cue Components</span></a>
      <ol class="toc">
-      <li><a href="#file-parsing"><span class="secno">5.1</span> <span class="content">WebVTT file parsing</span></a>
-      <li><a href="#region-settings-parsing"><span class="secno">5.2</span> <span class="content">WebVTT region settings parsing</span></a>
+      <li><a href="#default-text-color"><span class="secno">5.1</span> <span class="content">Default text colors</span></a>
+      <li><a href="#default-text-background"><span class="secno">5.2</span> <span class="content">Default text background colors</span></a>
-      <li><a href="#cue-timings-and-settings-parsing"><span class="secno">5.3</span> <span class="content">WebVTT cue timings and settings parsing</span></a>
-      <li><a href="#cue-text-parsing-rules"><span class="secno">5.4</span> <span class="content">WebVTT cue text parsing rules</span></a>
-      <li><a href="#dom-construction-rules"><span class="secno">5.5</span> <span class="content"><span>WebVTT cue text DOM construction rules</span></span></a>
-      <li><a href="#rules-for-extracting-the-chapter-title"><span class="secno">5.6</span> <span class="content">WebVTT rules for extracting the chapter
-title</span></a>
      </ol>
     <li>
-     <a href="#rendering"><span class="secno">6</span> <span class="content">Rendering</span></a>
+     <a href="#parsing"><span class="secno">6</span> <span class="content">Parsing</span></a>
      <ol class="toc">
+      <li><a href="#file-parsing"><span class="secno">6.1</span> <span class="content">WebVTT file parsing</span></a>
+      <li><a href="#region-settings-parsing"><span class="secno">6.2</span> <span class="content">WebVTT region settings parsing</span></a>
+      <li><a href="#cue-timings-and-settings-parsing"><span class="secno">6.3</span> <span class="content">WebVTT cue timings and settings parsing</span></a>
+      <li><a href="#cue-text-parsing-rules"><span class="secno">6.4</span> <span class="content">WebVTT cue text parsing rules</span></a>
+      <li><a href="#dom-construction-rules"><span class="secno">6.5</span> <span class="content"><span>WebVTT cue text DOM construction rules</span></span></a>
+      <li><a href="#rules-for-extracting-the-chapter-title"><span class="secno">6.6</span> <span class="content">WebVTT rules for extracting the chapter
+title</span></a>
+     </ol>
       <li>
-       <a href="#processing-model"><span class="secno">6.1</span> <span class="content">Processing model</span></a>
+     <a href="#rendering"><span class="secno">7</span> <span class="content">Rendering</span></a>
        <ol class="toc">
-        <li><a href="#applying-css-properties"><span class="secno">6.1.1</span> <span class="content">Applying CSS properties to <span>WebVTT Node Objects</span></span></a>
-       </ol>
+      <li><a href="#processing-model"><span class="secno">7.1</span> <span class="content">Processing model</span></a>
+      <li><a href="#processing-cue-settings"><span class="secno">7.2</span> <span class="content">Processing cue settings</span></a>
+      <li><a href="#obtaining-css-boxes"><span class="secno">7.3</span> <span class="content">Obtaining CSS boxes</span></a>
+      <li><a href="#applying-css-properties"><span class="secno">7.4</span> <span class="content">Applying CSS properties to <span>WebVTT Node Objects</span></span></a>
      </ol>
     <li>
-     <a href="#css-extensions"><span class="secno">7</span> <span class="content">CSS extensions</span></a>
+     <a href="#css-extensions"><span class="secno">8</span> <span class="content">CSS extensions</span></a>
      <ol class="toc">
-      <li><a href="#css-extensions-introduction"><span class="secno">7.1</span> <span class="content">Introduction</span></a>
+      <li><a href="#css-extensions-introduction"><span class="secno">8.1</span> <span class="content">Introduction</span></a>
       <li>
-       <a href="#css-extensions-processing-model"><span class="secno">7.2</span> <span class="content">Processing model</span></a>
+       <a href="#css-extensions-processing-model"><span class="secno">8.2</span> <span class="content">Processing model</span></a>
        <ol class="toc">
-        <li><a href="#the-cue-pseudo-element"><span class="secno">7.2.1</span> <span class="content">The <span class="css">::cue</span> pseudo-element</span></a>
-        <li><a href="#the-past-and-future-pseudo-classes"><span class="secno">7.2.2</span> <span class="content">The <span class="css">:past</span> and <span class="css">:future</span> pseudo-classes</span></a>
-        <li><a href="#the-cue-region-pseudo-element"><span class="secno">7.2.3</span> <span class="content">The <span class="css">::cue-region</span> pseudo-element</span></a>
+        <li><a href="#the-cue-pseudo-element"><span class="secno">8.2.1</span> <span class="content">The <span class="css">::cue</span> pseudo-element</span></a>
+        <li><a href="#the-past-and-future-pseudo-classes"><span class="secno">8.2.2</span> <span class="content">The <span class="css">:past</span> and <span class="css">:future</span> pseudo-classes</span></a>
+        <li><a href="#the-cue-region-pseudo-element"><span class="secno">8.2.3</span> <span class="content">The <span class="css">::cue-region</span> pseudo-element</span></a>
        </ol>
      </ol>
     <li>
-     <a href="#api"><span class="secno">8</span> <span class="content">API</span></a>
+     <a href="#api"><span class="secno">9</span> <span class="content">API</span></a>
      <ol class="toc">
-      <li><a href="#the-vttcue-interface"><span class="secno">8.1</span> <span class="content">The <code class="idl"><span>VTTCue</span></code> interface</span></a>
-      <li><a href="#the-vttregion-interface"><span class="secno">8.2</span> <span class="content">The <code class="idl"><span>VTTRegion</span></code> interface</span></a>
+      <li><a href="#the-vttcue-interface"><span class="secno">9.1</span> <span class="content">The <code class="idl"><span>VTTCue</span></code> interface</span></a>
+      <li><a href="#the-vttregion-interface"><span class="secno">9.2</span> <span class="content">The <code class="idl"><span>VTTRegion</span></code> interface</span></a>
      </ol>
     <li>
-     <a href="#iana"><span class="secno">9</span> <span class="content">IANA considerations</span></a>
+     <a href="#iana"><span class="secno">10</span> <span class="content">IANA considerations</span></a>
      <ol class="toc">
-      <li><a href="#iana-text-vtt"><span class="secno">9.1</span> <span class="content"><span><code>text/vtt</code></span></span></a>
+      <li><a href="#iana-text-vtt"><span class="secno">10.1</span> <span class="content"><span><code>text/vtt</code></span></span></a>
      </ol>
     <li>
      <a href="#privacy-and-security-considerations"><span class="secno"></span> <span class="content">Privacy and Security Considerations</span></a>
@@ -1664,7 +1711,15 @@
    <h2 class="heading settled" data-level="1" id="introduction"><span class="secno">1. </span><span class="content">Introduction</span><a class="self-link" href="#introduction"></a></h2>
    <p><i>This section is non-normative.</i></p>
    <p>The <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt">WebVTT</dfn> (Web Video Text Tracks) format is intended for marking up external text
-track resources.</p>
+track resources in connection with the HTML &lt;track> element.</p>
+   <p>WebVTT files provide captions or subtitles for video content, and also text video descriptions <a data-link-type="biblio" href="#biblio-maur">[MAUR]</a>, chapters for content navigation, and more generally any form of metadata that is
+time-aligned with audio or video content.</p>
+   <p>The majority of the current version of this specification is dedicated to describing how to use
+WebVTT files for captioning or subtitling. There is minimal information about chapters and
+time-aligned metadata and nothing about video descriptions at this stage.</p>
+   <p>In this section we provide some example WebVTT files as an introduction.</p>
+   <h3 class="heading settled" data-level="1.1" id="introduction-caption"><span class="secno">1.1. </span><span class="content">A simple caption file</span><a class="self-link" href="#introduction-caption"></a></h3>
+   <p><i>This section is non-normative.</i></p>
    <p>The main use for WebVTT files is captioning or subtitling video content. Here is a sample file
 that captions an interview:</p>
 <pre>WEBVTT
@@ -1708,7 +1763,21 @@
 00:35.500 --> 00:38.000
 &lt;v Roger Bingham>You know I’m so excited my glasses are falling off here.
 </pre>
-   <h3 class="heading settled" data-level="1.1" id="introduction-multiple-lines"><span class="secno">1.1. </span><span class="content">Cues with multiple lines</span><a class="self-link" href="#introduction-multiple-lines"></a></h3>
+   <p>You can see that a WebVTT file in general consists of a sequence of text segments associated with
+a time-interval, called a cue (<a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-1">definition</a>). Beyond captioning and subtitling,
+WebVTT can be used for time-aligned metadata, typically in use for delivering name-value pairs in
+cues. WebVTT can also be used for delivering chapters, which helps with contextual navigation around
+an audio/video file. Finally, WebVTT can be used for the delivery of text video descriptions, which
+is text that describes the visual content of time-intervals and can be synthesized to speech to help
+vision-impaired users understand context.</p>
+   <p class="note" role="note">This version of WebVTT focuses on solving the captioning and subtitling use cases.
+More specification work is possible for the other use cases. A decision on what type of use case a
+WebVTT file is being used for is made by the software that is using the file. For example, if in use
+with a HTML file through a &lt;track> element, the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#kind-of-track">kind</a> attribute
+defines how the WebVTT file is to be interpreted.</p>
+   <p>The following subsections provide an overview of some of the key features of the WebVTT file
+format, particularly when in use for captioning and subtitling.</p>
+   <h3 class="heading settled" data-level="1.2" id="introduction-multiple-lines"><span class="secno">1.2. </span><span class="content">Caption cues with multiple lines</span><a class="self-link" href="#introduction-multiple-lines"></a></h3>
    <p><i>This section is non-normative.</i></p>
    <p>Line breaks in cues are honored. User agents will also insert extra line breaks if necessary to
 fit the cue in the cue’s width. In general, therefore, authors are encouraged to write cues all on
@@ -1731,7 +1800,7 @@
     <p>The first cue is simple, it will probably just display on one line. The second will take two
  lines, one for each speaker. The third will wrap to fit the width of the video, possibly taking
  multiple lines. For example, the three cues could look like this:</p>
-<pre>           <samp>Never drink liquid nitrogen.</samp>
+<pre>           <samp>Never drink liquid nitrogen.</samp>
         <samp>— It will perforate your stomach.</samp>
                 <samp>— You could die.</samp>
@@ -1744,7 +1813,7 @@
 </pre>
     <p>If the width of the cues is smaller, the first two cues could wrap as well, as in the following
  example. Note how the second cue’s explicit line break is still honored, however:</p>
-<pre>      <samp>Never drink</samp>
+<pre>      <samp>Never drink</samp>
     <samp>liquid nitrogen.</samp>
   <samp>— It will perforate</samp>
@@ -1764,53 +1833,7 @@
 </pre>
     <p>Also notice how the wrapping is done so as to keep the line lengths balanced.</p>
    </div>
-   <h3 class="heading settled" data-level="1.2" id="introduction-comments"><span class="secno">1.2. </span><span class="content">Comments</span><a class="self-link" href="#introduction-comments"></a></h3>
+   <h3 class="heading settled" data-level="1.3" id="styling"><span class="secno">1.3. </span><span class="content">Styling captions</span><a class="self-link" href="#styling"></a></h3>
-   <p><i>This section is non-normative.</i></p>
-   <p>Comments can be included in WebVTT files.</p>
-   <p>Comments are just blocks that are preceded by a blank line, start with the word
-"<code>NOTE</code>" (followed by a space or newline), and end at the first blank line.</p>
-   <div class="example" id="example-44941b0b">
-    <a class="self-link" href="#example-44941b0b"></a>
-    <p>Here, a one-line comment is used to note a possible problem with a cue.</p>
-<pre>WEBVTT
-            -
-00:01.000 --> 00:04.000
-Never drink liquid nitrogen.
-            -
-NOTE I’m not sure the timing is right on the following cue.
-            -
-00:05.000 --> 00:09.000
-— It will perforate your stomach.
-— You could die.
-</pre>
-   </div>
-   <div class="example" id="example-03a9f3ad">
-    <a class="self-link" href="#example-03a9f3ad"></a>
-    <p>In this example, the author has written many comments.</p>
-<pre>WEBVTT
-            -
-NOTE
-This file was written by Jill. I hope
-you enjoy reading it. Some things to
-bear in mind:
-- I was lip-reading, so the cues may
-not be 100% accurate
-- I didn’t pay too close attention to
-when the cues should start or end.
-            -
-00:01.000 --> 00:04.000
-Never drink liquid nitrogen.
-            -
-NOTE check next cue
-            -
-00:05.000 --> 00:09.000
-— It will perforate your stomach.
-— You could die.
-            -
-NOTE end of file
-</pre>
-   </div>
-   <h3 class="heading settled" data-level="1.3" id="styling"><span class="secno">1.3. </span><span class="content">Styling</span><a class="self-link" href="#styling"></a></h3>
    <p><i>This section is non-normative.</i></p>
    <p>CSS style sheets that apply to an HTML page that contains a <a data-link-type="element" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#the-video-element">video</a> element can
 target WebVTT cues and regions in the video using the <span class="css">::cue</span>, <span class="css">::cue()</span>, <span class="css">::cue-region</span> and <span class="css">::cue-region()</span> pseudo-elements.</p>
@@ -1876,15 +1899,19 @@
 NOTE style blocks cannot appear after the first cue.
 </pre>
    </div>
-   <h3 class="heading settled" data-level="1.4" id="introduction-other-features"><span class="secno">1.4. </span><span class="content">Other features</span><a class="self-link" href="#introduction-other-features"></a></h3>
+   <h3 class="heading settled" data-level="1.4" id="introduction-other-features"><span class="secno">1.4. </span><span class="content">Other caption and subtitling features</span><a class="self-link" href="#introduction-other-features"></a></h3>
    <p><i>This section is non-normative.</i></p>
    <p>WebVTT also supports some less-often used features.</p>
-   <div class="example" id="example-5046f22f">
-    <a class="self-link" href="#example-5046f22f"></a>
+   <div class="example" id="example-59f83607">
+    <a class="self-link" href="#example-59f83607"></a>
     <p>In this example, the cues have an identifier:</p>
 <pre>WEBVTT
-1
+test
+00:00.000 --> 00:02.000
+This is a test.
+            +
+123
 00:00.000 --> 00:02.000
 That’s an, an, that’s an L!
@@ -1892,9 +1919,16 @@
 00:04.000 --> 00:05.000
 Transcrit par Célestes™
 </pre>
-    <p>This allows a style sheet to specifically target the cues (notice the use of CSS character
- escape sequences):</p>
-<pre>::cue(#\31) { color: lime; }
+    <p>This allows a style sheet to specifically target the cues.</p>
+<pre>/* style for cue: test */
+::cue(#test) { color: lime; }
+</pre>
+    <p>Due to the syntax rules of CSS, some characters need to be escaped with CSS character escape
+ sequences. For example, an ID that starts with a number 0-9 needs to be escaped. The ID <code>123</code> can be represented as "\31 23" (31 refers to the Unicode code point for "1"). See <a href="https://www.w3.org/International/questions/qa-escapes">Using character escapes in markup
+ and CSS</a> for more information on CSS escapes.</p>
+<pre>/* style for cue: 123 */
+::cue(#\31 23) { color: lime; }
+/* style for cue: crédit de transcription */
 ::cue(#crédit\ de\ transcription) { color: red; }
 </pre>
    </div>
@@ -1940,8 +1974,8 @@
 ::cue(.loud) { font-size: 2em }
 </pre>
    </div>
-   <div class="example" id="example-0c2976c9">
-    <a class="self-link" href="#example-0c2976c9"></a>
+   <div class="example" id="example-b30cb609">
+    <a class="self-link" href="#example-b30cb609"></a>
     <p>This example shows how to position cues at explicit positions in the video viewport.</p>
 <pre>WEBVTT
@@ -1956,7 +1990,7 @@
 </pre>
     <p>Since the cues in these examples are horizontal, the "position" setting refers to a percentage
  of the width of the video viewpoint. If the text were vertical, the "position" setting would refer
- to the height of the viewport.</p>
+ to the height of the video viewport.</p>
     <p>The "line-left" or "line-right" only refers to the physical side of the box to which the
  "position" setting applies, in a way which is agnostic regarding the horizontal or vertical
  direction of the cue. It does not affect or relate to the direction or position of the text itself
@@ -2025,6 +2059,118 @@
 </pre>
     <p>Note that regions are only defined for horizontal cues.</p>
    </div>
+   <h3 class="heading settled" data-level="1.5" id="introduction-comments"><span class="secno">1.5. </span><span class="content">Comments in WebVTT</span><a class="self-link" href="#introduction-comments"></a></h3>
+   <p><i>This section is non-normative.</i></p>
+   <p>Comments can be included in WebVTT files.</p>
+   <p>Comments are just blocks that are preceded by a blank line, start with the word
+"<code>NOTE</code>" (followed by a space or newline), and end at the first blank line.</p>
+   <div class="example" id="example-44941b0b">
+    <a class="self-link" href="#example-44941b0b"></a>
+    <p>Here, a one-line comment is used to note a possible problem with a cue.</p>
+<pre>WEBVTT
+            +
+00:01.000 --> 00:04.000
+Never drink liquid nitrogen.
+            +
+NOTE I’m not sure the timing is right on the following cue.
+            +
+00:05.000 --> 00:09.000
+— It will perforate your stomach.
+— You could die.
+</pre>
+   </div>
+   <div class="example" id="example-03a9f3ad">
+    <a class="self-link" href="#example-03a9f3ad"></a>
+    <p>In this example, the author has written many comments.</p>
+<pre>WEBVTT
+            +
+NOTE
+This file was written by Jill. I hope
+you enjoy reading it. Some things to
+bear in mind:
+- I was lip-reading, so the cues may
+not be 100% accurate
+- I didn’t pay too close attention to
+when the cues should start or end.
+            +
+00:01.000 --> 00:04.000
+Never drink liquid nitrogen.
+            +
+NOTE check next cue
+            +
+00:05.000 --> 00:09.000
+— It will perforate your stomach.
+— You could die.
+            +
+NOTE end of file
+</pre>
+   </div>
+   <h3 class="heading settled" data-level="1.6" id="introduction-chapters"><span class="secno">1.6. </span><span class="content">Chapters example</span><a class="self-link" href="#introduction-chapters"></a></h3>
+   <p><i>This section is non-normative.</i></p>
+   <p>A WebVTT file can consist of chapters, which are navigation markers for the video.</p>
+   <p>Chapters are plain text, typically just a single line.</p>
+   <div class="example" id="example-5b78f944">
+    <a class="self-link" href="#example-5b78f944"></a>
+    <p>In this example, a talk is split into each slide being a chapter.</p>
+<pre>WEBVTT
+            +
+NOTE
+This is from a talk Silvia gave about WebVTT.
+            +
+Slide 1
+00:00:00.000 --> 00:00:10.700
+Title Slide
+            +
+Slide 2
+00:00:10.700 --> 00:00:47.600
+Introduction by Naomi Black
+            +
+Slide 3
+00:00:47.600 --> 00:01:50.100
+Impact of Captions on the Web
+            +
+Slide 4
+00:01:50.100 --> 00:03:33.000
+Requirements of a Video text format
+</pre>
+   </div>
+   <h3 class="heading settled" data-level="1.7" id="introduction-metadata"><span class="secno">1.7. </span><span class="content">Metadata example</span><a class="self-link" href="#introduction-metadata"></a></h3>
+   <p><i>This section is non-normative.</i></p>
+   <p>A WebVTT file can consist of time-aligned metadata.</p>
+   <p>Metadata can be any string and is often provided as a JSON construct.</p>
+   <p>Note that you cannot provide blank lines inside a metadata block, because the blank line
+signifies the end of the WebVTT cue.</p>
+   <div class="example" id="example-7e3f730b">
+    <a class="self-link" href="#example-7e3f730b"></a>
+    <p>In this example, a talk is split into each slide being a chapter.</p>
+<pre>WEBVTT
+            +
+NOTE
+Thanks to http://output.jsbin.com/mugibo
+            +
+1
+00:00:00.100 --> 00:00:07.342
+{
+ "type": "WikipediaPage",
+ "url": "https://en.wikipedia.org/wiki/Samurai_Pizza_Cats"
+}
+            +
+2
+00:07.810 --> 00:09.221
+{
+ "type": "WikipediaPage",
+ "url" :"http://samuraipizzacats.wikia.com/wiki/Samurai_Pizza_Cats_Wiki"
+}
+            +
+3
+00:11.441 --> 00:14.441
+{
+ "type": "LongLat",
+ "lat" : "36.198269",
+ "long": "137.2315355"
+}
+</pre>
+   </div>
    <h2 class="heading settled" data-level="2" id="conformance"><span class="secno">2. </span><span class="content">Conformance</span><a class="self-link" href="#conformance"></a></h2>
    <p>All diagrams, examples, and notes in this specification are non-normative, as are all sections
 explicitly marked non-normative. Everything else in this specification is normative.</p>
@@ -2043,7 +2189,7 @@
    <p>This specification describes the conformance criteria for user agents (relevant to implementors)
 and <a data-link-type="dfn" href="#webvtt-file" id="ref-for-webvtt-file-1">WebVTT files</a> (relevant to authors and authoring tool implementors).</p>
    <p class="note" role="note"><a href="#syntax">§4 Syntax</a> defines what consists of a valid <a data-link-type="dfn" href="#webvtt-file" id="ref-for-webvtt-file-2">WebVTT file</a>. Authors need to
-follow the requirements therein, and are encouraged to use a conformance checker. <a href="#parsing">§5 Parsing</a> defines how user agents are to interpret a file labelled as <a data-link-type="dfn" href="#text-vtt" id="ref-for-text-vtt-1">text/vtt</a>, for both valid and
+follow the requirements therein, and are encouraged to use a conformance checker. <a href="#parsing">§6 Parsing</a> defines how user agents are to interpret a file labelled as <a data-link-type="dfn" href="#text-vtt" id="ref-for-text-vtt-1">text/vtt</a>, for both valid and
 invalid <a data-link-type="dfn" href="#webvtt-file" id="ref-for-webvtt-file-3">WebVTT files</a>. The parsing rules are more tolerant to author errors than the syntax
 allows, in order to provide for extensibility and to still render cues that have some syntax
 errors.</p>
@@ -2060,7 +2206,26 @@
  specification. <a data-link-type="biblio" href="#biblio-webidl-1">[WEBIDL-1]</a></p>
     <dt>User agents with no scripting support
     <dd>
-     <p>All processing requirements in this specification apply, except those in <a href="#api">§8 API</a>.</p>
+     <p>All processing requirements in this specification apply, except those in <a href="#dom-construction-rules">§6.5 WebVTT cue text DOM construction rules</a> and <a href="#api">§9 API</a>.</p>
+    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="user-agents-that-do-not-support-css">User agents that do not support CSS</dfn>
+    <dd>
+     <p>All processing requirements in this specification apply, except parts of <a href="#parsing">§6 Parsing</a> that
+ relate to stylesheets and CSS, and all of <a href="#rendering">§7 Rendering</a> and <a href="#css-extensions">§8 CSS extensions</a>. The user agent
+ must instead only render the text inside <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-text" id="ref-for-webvtt-caption-or-subtitle-cue-text-1">WebVTT caption or subtitle cue text</a> in an
+ appropriate manner and specifically support the color classes defined in <a href="#default-classes">§5 Default classes for WebVTT Caption or Subtitle Cue Components</a>. Any
+ other styling instructions are optional.</p>
+    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="user-agents-that-do-not-support-a-full-html-css-engine">User agents that do not support a full HTML CSS engine</dfn>
+    <dd>
+     <p>All processing requirements in this specification apply, including the color classes defined
+ in <a href="#default-classes">§5 Default classes for WebVTT Caption or Subtitle Cue Components</a>. However, the user agent will need to apply the CSS related features in <a href="#parsing">§6 Parsing</a>, <a href="#rendering">§7 Rendering</a> and <a href="#css-extensions">§8 CSS extensions</a> in such a way that the rendered results are
+ equivalent to what a full CSS supporting renderer produces.</p>
+    <dt><dfn data-dfn-type="dfn" data-noexport="" id="user-agents-that-support-a-full-html-css-engine">User agents that support a full HTML CSS engine<a class="self-link" href="#user-agents-that-support-a-full-html-css-engine"></a></dfn>
+    <dd>
+     <p>All processing requirements in this specification apply. However, only a limited set of CSS
+ styles is allowed because <a data-link-type="dfn" href="#user-agents-that-do-not-support-a-full-html-css-engine" id="ref-for-user-agents-that-do-not-support-a-full-html-css-engine-1">user agents that do not support a full HTML CSS engine</a> will need
+ to implement CSS functionality equivalents. User agents that support a full CSS engine must
+ therefore limit the CSS styles they apply for WebVTT so as to enable identical rendering without
+ bleeding in extra CSS styles that are beyond the WebVTT specification.</p>
     <dt>Conformance checkers
     <dd>
      <p>Conformance checkers must verify that a <a data-link-type="dfn" href="#webvtt-file" id="ref-for-webvtt-file-4">WebVTT file</a> conforms to the applicable
@@ -2083,20 +2248,50 @@
 cue with an ID consisting of the character U+00C5 LATIN CAPITAL LETTER A WITH RING ABOVE (a
 precomposed character).</p>
    <h2 class="heading settled" data-level="3" id="data-model"><span class="secno">3. </span><span class="content">Data model</span><a class="self-link" href="#data-model"></a></h2>
-   <h3 class="heading settled" data-level="3.1" id="cues"><span class="secno">3.1. </span><span class="content">WebVTT cues</span><a class="self-link" href="#cues"></a></h3>
-   <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-cue">WebVTT cue</dfn> is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#cue">text track cue</a> that additionally consist of the following: <a data-link-type="biblio" href="#biblio-html51">[HTML51]</a></p>
+   <p class="note" role="note">The box model of WebVTT consists of three key elements: the video viewport, cues, and
+regions. The video viewport is the rendering area into which cues and regions are rendered. Cues are
+boxes consisting of a set of cue lines. Regions are subareas of the video viewport that are used to
+group cues together. Cues are positioned either inside the video viewport directly or inside a
+region, which is positioned inside the video viewport.</p>
+   <p class="note" role="note">The position of a cue inside the video viewport is defined by a set of cue settings.
+The position of a region inside the video viewport is defined by a set of region settings. Cues that
+are inside regions can only use a limited set of their cue settings. Specifically, if the cue has a
+"vertical", "line" or "size" setting, the cue drops out of the region. Otherwise, the cue’s width is
+calculated to be relative to the region width rather than the viewport. </p>
+   <h3 class="heading settled" data-level="3.1" id="model-overview"><span class="secno">3.1. </span><span class="content">Overview</span><a class="self-link" href="#model-overview"></a></h3>
+   <p><i>This section is non-normative.</i></p>
+   <p>The WebVTT file is a container file for chunks of data that are time-aligned with a video or
+audio resource. It can therefore be regarded as a serialisation format for time-aligned data.</p>
+   <p>A WebVTT file starts with a header and then contains a series of data blocks. If a data block has
+a start and end time, it is called a WebVTT cue. A comment is another kind of data block.</p>
+   <p>Different kinds of data can be carried in WebVTT files. The HTML specification identifies
+captions, subtitles, chapters, audio descriptions and metadata as data kinds and specifies which one
+is being used in the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#kind-of-track">text track kind</a> attribute of the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text track</a> element <a data-link-type="biblio" href="#biblio-html51">[HTML51]</a>.</p>
+   <p>A WebVTT file must only contain data of one kind, never a mix of different kinds of data. The
+data kind of a WebVTT file is externally specified, such as in a HTML file’s <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text track</a> element. The environment is responsible for interpreting the data correctly.</p>
+   <p>WebVTT caption or subtitle cues are rendered as overlays on top of a video viewport or into a
+region, which is a subarea of the video viewport.</p>
+   <h3 class="heading settled" data-level="3.2" id="model-cues"><span class="secno">3.2. </span><span class="content">WebVTT cues</span><a class="self-link" href="#model-cues"></a></h3>
+   <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-cue">WebVTT cue</dfn> is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#cue">text track cue</a> <a data-link-type="biblio" href="#biblio-html51">[HTML51]</a> that additionally consist of the
+following: </p>
    <dl>
-    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="text track cue text" data-noexport="" id="text-track-cue-text">A cue text</dfn>
+    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="cue text" data-noexport="" id="cue-text">A cue text</dfn>
     <dd>
-     <p>The raw text of the cue, and rules for its interpretation, allowing the text to be rendered and
-  converted to a DOM fragment.</p>
+     <p>The raw text of the cue, and rules for its interpretation.</p>
+   </dl>
+   <h3 class="heading settled" data-level="3.3" id="cues"><span class="secno">3.3. </span><span class="content">WebVTT caption or subtitle cues</span><a class="self-link" href="#cues"></a></h3>
+   <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-caption-or-subtitle-cue">WebVTT caption or subtitle cue</dfn> is a <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-2">WebVTT cue</a> that has the following
+additional properties allowing the <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-1">cue text</a> to be rendered and converted to a DOM
+fragment:</p>
+   <dl>
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT cue box" data-noexport="" id="webvtt-cue-box">A cue box</dfn>
     <dd>
-     <p>The cue box of a <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-1">WebVTT cue</a> is a box within which the text of all lines of the cue is to
-  be rendered.</p>
+     <p>The cue box of a <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-3">WebVTT cue</a> is a box within which the text of all lines of the cue is to
+  be rendered. It is either rendered into the video’s viewport or a region inside the viewport if
+  the cue is part of a region.</p>
      <p class="note" role="note">The position of the <a data-link-type="dfn" href="#webvtt-cue-box" id="ref-for-webvtt-cue-box-6">cue box</a> within the video viewport’s
-  dimensions depends on the value of the <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-1">WebVTT cue position</a> and the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-1">WebVTT cue
-  line</a>.</p>
+  or region’s dimensions depends on the value of the <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-1">WebVTT cue position</a> and the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-1">WebVTT
+  cue line</a>.</p>
      <p class="note" role="note">Lines are wrapped within the <a data-link-type="dfn" href="#webvtt-cue-box" id="ref-for-webvtt-cue-box-7">cue box</a>’s <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-1">size</a> if lines' lengths make this necessary.</p>
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT cue writing direction" data-noexport="" id="webvtt-cue-writing-direction">A writing direction</dfn>
     <dd>
@@ -2125,42 +2320,41 @@
      <p>A boolean indicating whether the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-3">line</a> is an integer number of lines
   (using the line dimensions of the first line of the cue), or whether it is a percentage of the
   dimension of the video. The flag is set to true when lines are counted, and false otherwise.</p>
-     <p>Cues whose <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-1">WebVTT cue snap-to-lines flag</a> is true will be placed within the title-safe
-  area on user agents that use overscan. Cues where the flag is false will be offset as requested
-  (modulo overlap avoidance if multiple cues are in the same place).</p>
+     <p>Cues where the flag is false will be offset as requested modulo overlap avoidance if multiple
+  cues are in the same place.</p>
+     <p>By default, the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-1">snap-to-lines flag</a> is set to
-     <p>By default, the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-2">snap-to-lines flag</a> is set to
   true.</p>
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT cue line" data-noexport="" id="webvtt-cue-line">A line</dfn>
     <dd>
      <p>The <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-4">line</a> defines positioning of the <a data-link-type="dfn" href="#webvtt-cue-box" id="ref-for-webvtt-cue-box-8">cue
   box</a>.</p>
      <p>The <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-5">line</a> offsets the <a data-link-type="dfn" href="#webvtt-cue-box" id="ref-for-webvtt-cue-box-9">cue box</a> from the
-  top, the right or left of the video viewport as defined by the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-3">writing direction</a>, the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-3">snap-to-lines
+  top, the right or left of the video viewport as defined by the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-3">writing direction</a>, the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-2">snap-to-lines
   flag</a>, or the lines occupied by any other showing tracks.</p>
      <p>The <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-6">line</a> is set either as a number of lines, a percentage of the
   video viewport height or width, or as the special value <dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT cue line
   automatic" data-noexport="" id="webvtt-cue-line-automatic">auto</dfn>, which means the offset is to depend on the other showing tracks.</p>
      <p>By default, the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-7">line</a> is set to <a data-link-type="dfn" href="#webvtt-cue-line-automatic" id="ref-for-webvtt-cue-line-automatic-1">auto</a>.</p>
      <p>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-4">writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-2">horizontal</a>, then the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-8">line</a> percentages are relative to the height of the video, otherwise to the width of the video.</p>
-     <p>A <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-2">WebVTT cue</a> has a <dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="cue computed line" data-noexport="" id="cue-computed-line">computed line</dfn> whose value is that
+     <p>A <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-4">WebVTT cue</a> has a <dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="cue computed line" data-noexport="" id="cue-computed-line">computed line</dfn> whose value is that
   returned by the following algorithm, which is defined in terms of the other aspects of the
   cue:</p>
      <ol class="algorithm" data-algorithm="computed line">
       <li>
-       <p>If the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-9">line</a> is numeric, the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-4">WebVTT cue snap-to-lines flag</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-3">WebVTT cue</a> is false, and the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-10">line</a> is negative or
+       <p>If the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-9">line</a> is numeric, the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-3">WebVTT cue snap-to-lines flag</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-5">WebVTT cue</a> is false, and the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-10">line</a> is negative or
     greater than 100, then return 100 and abort these steps.</p>
-       <p class="note" role="note">Although the <a data-link-type="dfn" href="#webvtt-parser" id="ref-for-webvtt-parser-1">WebVTT parser</a> will not set the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-11">line</a> to a number outside the range 0..100 and also set the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-5">WebVTT cue snap-to-lines
+       <p class="note" role="note">Although the <a data-link-type="dfn" href="#webvtt-parser" id="ref-for-webvtt-parser-1">WebVTT parser</a> will not set the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-11">line</a> to a number outside the range 0..100 and also set the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-4">WebVTT cue snap-to-lines
     flag</a> to false, this can happen when using the DOM API’s <code class="idl"><a data-link-type="idl" href="#dom-vttcue-snaptolines" id="ref-for-dom-vttcue-snaptolines-1">snapToLines</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-vttcue-line" id="ref-for-dom-vttcue-line-1">line</a></code> attributes.</p>
       <li>
        <p>If the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-12">line</a> is numeric, return the value of the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-13">WebVTT cue
-   line</a> and abort these steps. (Either the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-6">WebVTT cue snap-to-lines flag</a> is true, so any
+   line</a> and abort these steps. (Either the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-5">WebVTT cue snap-to-lines flag</a> is true, so any
    value, not just those in the range 0..100, is valid, or the value is in the range 0..100 and is
    thus valid regardless of the value of that flag.)</p>
       <li>
-       <p>If the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-7">WebVTT cue snap-to-lines flag</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-4">WebVTT cue</a> is false, return the
+       <p>If the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-6">WebVTT cue snap-to-lines flag</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-6">WebVTT cue</a> is false, return the
    value 100 and abort these steps. (The <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-14">line</a> is the special value <a data-link-type="dfn" href="#webvtt-cue-line-automatic" id="ref-for-webvtt-cue-line-automatic-2">auto</a>.)</p>
       <li>
-       <p>Let <var>cue</var> be the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-5">WebVTT cue</a>.</p>
+       <p>Let <var>cue</var> be the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-7">WebVTT cue</a>.</p>
       <li>
        <p>If <var>cue</var> is not in a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#list-of-cues">list of cues</a> of a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text
    track</a>, or if that <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text track</a> is not in the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#list-of-text-tracks">list of text tracks</a> of a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media
@@ -2177,7 +2371,7 @@
       <li>
        <p>Return <var>n</var>.</p>
      </ol>
-     <p class="example" id="example-d1c46c31"><a class="self-link" href="#example-d1c46c31"></a>For example, if two <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text tracks</a> are <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#modedef-track-showing">showing</a> at the same time in one <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media element</a>, and each <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text track</a> currently has an active <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-6">WebVTT cue</a> whose <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-15">line</a> are both <a data-link-type="dfn" href="#webvtt-cue-line-automatic" id="ref-for-webvtt-cue-line-automatic-3">auto</a>, then the first <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text track</a>’s cue’s <a data-link-type="dfn" href="#cue-computed-line" id="ref-for-cue-computed-line-1">computed line</a> will be −1 and the second will be −2.</p>
+     <p class="example" id="example-d1c46c31"><a class="self-link" href="#example-d1c46c31"></a>For example, if two <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text tracks</a> are <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#modedef-track-showing">showing</a> at the same time in one <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media element</a>, and each <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text track</a> currently has an active <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-8">WebVTT cue</a> whose <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-15">line</a> are both <a data-link-type="dfn" href="#webvtt-cue-line-automatic" id="ref-for-webvtt-cue-line-automatic-3">auto</a>, then the first <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text track</a>’s cue’s <a data-link-type="dfn" href="#cue-computed-line" id="ref-for-cue-computed-line-1">computed line</a> will be −1 and the second will be −2.</p>
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT cue line alignment" data-noexport="" id="webvtt-cue-line-alignment">A line alignment</dfn>
     <dd>
      <p>An alignment for the <a data-link-type="dfn" href="#webvtt-cue-box" id="ref-for-webvtt-cue-box-10">cue box</a>’s <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-16">line</a>, one
@@ -2204,12 +2398,13 @@
   dimensions.</p>
      <p>By default, the <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-5">position</a> is set to <a data-link-type="dfn" href="#webvtt-cue-automatic-position" id="ref-for-webvtt-cue-automatic-position-1">auto</a>.</p>
      <p>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-6">writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-5">horizontal</a>, then the <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-6">position</a> percentages are relative to the width of the video, otherwise to the height of the video.</p>
-     <p>A <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-7">WebVTT cue</a> has a <dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="cue computed position" data-noexport="" id="cue-computed-position">computed position</dfn> whose value
+     <p>A <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-9">WebVTT cue</a> has a <dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="cue computed position" data-noexport="" id="cue-computed-position">computed position</dfn> whose value
   is that returned by the following algorithm, which is defined in terms of the other aspects of the
   cue:</p>
      <ol class="algorithm" data-algorithm="computed position">
       <li>
-       <p>If the <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-7">position</a> is numeric, then return the value of the <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-8">position</a> and abort these steps. (Otherwise, the <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-9">position</a> is the special value <a data-link-type="dfn" href="#webvtt-cue-automatic-position" id="ref-for-webvtt-cue-automatic-position-2">auto</a>.)</p>
+       <p>If the <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-7">position</a> is numeric between 0 and 100, then return
+   the value of the <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-8">position</a> and abort these steps. (Otherwise, the <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-9">position</a> is the special value <a data-link-type="dfn" href="#webvtt-cue-automatic-position" id="ref-for-webvtt-cue-automatic-position-2">auto</a>.)</p>
       <li>
        <p>If the <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-3">cue text alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-left-alignment" id="ref-for-webvtt-cue-left-alignment-1">left</a>, return 0 and abort these steps.</p>
       <li>
@@ -2222,12 +2417,12 @@
   right-to-left cue text, the <a data-link-type="dfn" href="#webvtt-cue-box" id="ref-for-webvtt-cue-box-16">cue box</a> is positioned from the left edge of
   the video viewport. This allows defining a rendering space template which can be filled with
   either left-to-right or right-to-left cue text, or both.</p>
-     <p>For <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-8">WebVTT cues</a> that have a <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-3">size</a> other than 100%, and a <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-6">text alignment</a> of <a data-link-type="dfn" href="#webvtt-cue-start-alignment" id="ref-for-webvtt-cue-start-alignment-1">start</a> or <a data-link-type="dfn" href="#webvtt-cue-end-alignment" id="ref-for-webvtt-cue-end-alignment-1">end</a>, authors must not use the default <a data-link-type="dfn" href="#webvtt-cue-automatic-position" id="ref-for-webvtt-cue-automatic-position-3">auto</a> <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-11">position</a>.</p>
+     <p>For <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-10">WebVTT cues</a> that have a <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-3">size</a> other than 100%, and a <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-6">text alignment</a> of <a data-link-type="dfn" href="#webvtt-cue-start-alignment" id="ref-for-webvtt-cue-start-alignment-1">start</a> or <a data-link-type="dfn" href="#webvtt-cue-end-alignment" id="ref-for-webvtt-cue-end-alignment-1">end</a>, authors must not use the default <a data-link-type="dfn" href="#webvtt-cue-automatic-position" id="ref-for-webvtt-cue-automatic-position-3">auto</a> <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-11">position</a>.</p>
      <p class="note" role="note">When the <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-7">text alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-start-alignment" id="ref-for-webvtt-cue-start-alignment-2">start</a> or <a data-link-type="dfn" href="#webvtt-cue-end-alignment" id="ref-for-webvtt-cue-end-alignment-2">end</a>, the <a data-link-type="dfn" href="#webvtt-cue-automatic-position" id="ref-for-webvtt-cue-automatic-position-4">auto</a> <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-12">position</a> is 50%. This is different
   from <a data-link-type="dfn" href="#webvtt-cue-left-alignment" id="ref-for-webvtt-cue-left-alignment-2">left</a> and <a data-link-type="dfn" href="#webvtt-cue-right-alignment" id="ref-for-webvtt-cue-right-alignment-2">right</a> aligned text, where the <a data-link-type="dfn" href="#webvtt-cue-automatic-position" id="ref-for-webvtt-cue-automatic-position-5">auto</a> <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-13">position</a> is 0% and 100%, respectively. The above requirement is present because it
-  can be surprising that automatic positioning doesn’t work for <a data-link-type="dfn" href="#webvtt-cue-start-alignment" id="ref-for-webvtt-cue-start-alignment-3">start</a> or <a data-link-type="dfn" href="#webvtt-cue-end-alignment" id="ref-for-webvtt-cue-end-alignment-3">end</a> aligned text. Since <a data-link-type="dfn" href="#webvtt-cue-text" id="ref-for-webvtt-cue-text-1">cue text</a> can consist of text with left-to-right base direction, or right-to-left
-  base direction, or both (on different lines), such automatic positioning would have unexpected
-  results.</p>
+  can be surprising that automatic positioning doesn’t work for <a data-link-type="dfn" href="#webvtt-cue-start-alignment" id="ref-for-webvtt-cue-start-alignment-3">start</a> or <a data-link-type="dfn" href="#webvtt-cue-end-alignment" id="ref-for-webvtt-cue-end-alignment-3">end</a> aligned text. Since <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-2">cue
+  text</a> can consist of text with left-to-right base direction, or right-to-left base direction,
+  or both (on different lines), such automatic positioning would have unexpected results.</p>
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT cue position alignment" data-noexport="" id="webvtt-cue-position-alignment">A position alignment</dfn>
     <dd>
      <p>An alignment for the <a data-link-type="dfn" href="#webvtt-cue-box" id="ref-for-webvtt-cue-box-17">cue box</a> in the dimension of the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-7">writing direction</a>, describing what the <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-14">position</a> is anchored to, one of:</p>
@@ -2242,7 +2437,7 @@
       <dd>The <a data-link-type="dfn" href="#webvtt-cue-box" id="ref-for-webvtt-cue-box-21">cue box</a>’s alignment depends on the value of the <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-8">text alignment</a> of the cue.
      </dl>
      <p>By default, the <a data-link-type="dfn" href="#webvtt-cue-position-alignment" id="ref-for-webvtt-cue-position-alignment-2">position alignment</a> is set to <a data-link-type="dfn" href="#webvtt-cue-position-automatic-alignment" id="ref-for-webvtt-cue-position-automatic-alignment-1">auto</a>.</p>
-     <p>A <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-9">WebVTT cue</a> has a <dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="cue computed position alignment" data-noexport="" id="cue-computed-position-alignment">computed position
+     <p>A <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-11">WebVTT cue</a> has a <dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="cue computed position alignment" data-noexport="" id="cue-computed-position-alignment">computed position
   alignment</dfn> whose value is that returned by the following algorithm, which is defined in terms
   of other aspects of the cue:</p>
      <ol class="algorithm" data-algorithm="computed position alignment">
@@ -2258,11 +2453,19 @@
    return <a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-1">line-right</a> and abort these
    steps.</p>
       <li>
+       <p>If the <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-11">WebVTT cue text alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-start-alignment" id="ref-for-webvtt-cue-start-alignment-4">start</a>,
+   return <a data-link-type="dfn" href="#webvtt-cue-position-line-left-alignment" id="ref-for-webvtt-cue-position-line-left-alignment-2">line-left</a> if the base direction of the
+   cue text is left-to-right, <a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-2">line-right</a> otherwise.</p>
+      <li>
+       <p>If the <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-12">WebVTT cue text alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-end-alignment" id="ref-for-webvtt-cue-end-alignment-4">end</a>,
+   return <a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-3">line-right</a> if the base direction of
+   the cue text is left-to-right, <a data-link-type="dfn" href="#webvtt-cue-position-line-left-alignment" id="ref-for-webvtt-cue-position-line-left-alignment-3">line-left</a> otherwise.</p>
+      <li>
        <p>Otherwise, return <a data-link-type="dfn" href="#webvtt-cue-center-alignment" id="ref-for-webvtt-cue-center-alignment-2">center</a>.</p>
      </ol>
      <p class="note" role="note">Since the <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-18">position</a> always measures from the left
   of the video (for <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-9">horizontal</a> cues) or the top
-  (otherwise), the <a data-link-type="dfn" href="#webvtt-cue-position-alignment" id="ref-for-webvtt-cue-position-alignment-5">WebVTT cue position alignment</a> <a data-link-type="dfn" href="#webvtt-cue-position-line-left-alignment" id="ref-for-webvtt-cue-position-line-left-alignment-2">line-left</a> value varies between left and top for horizontal and vertical cues.</p>
+  (otherwise), the <a data-link-type="dfn" href="#webvtt-cue-position-alignment" id="ref-for-webvtt-cue-position-alignment-5">WebVTT cue position alignment</a> <a data-link-type="dfn" href="#webvtt-cue-position-line-left-alignment" id="ref-for-webvtt-cue-position-line-left-alignment-4">line-left</a> value varies between left and top for horizontal and vertical cues.</p>
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT cue size" data-noexport="" id="webvtt-cue-size">A size</dfn>
     <dd>
      <p>A number giving the size of the <a data-link-type="dfn" href="#webvtt-cue-box" id="ref-for-webvtt-cue-box-22">cue box</a>, to be interpreted as a
@@ -2289,7 +2492,7 @@
       <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT cue right alignment" data-noexport="" id="webvtt-cue-right-alignment">Right alignment</dfn>
       <dd>The text is aligned to the box’s right side (for <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-12">horizontal</a> cues) or bottom side (otherwise).
      </dl>
-     <p>By default, the <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-11">text alignment</a> is set to <a data-link-type="dfn" href="#webvtt-cue-center-alignment" id="ref-for-webvtt-cue-center-alignment-3">center</a>.</p>
+     <p>By default, the <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-13">text alignment</a> is set to <a data-link-type="dfn" href="#webvtt-cue-center-alignment" id="ref-for-webvtt-cue-center-alignment-3">center</a>.</p>
      <p class="note" role="note">The base direction of each line in a cue (which is used by the Unicode Bidirectional
   Algorithm to determine the order in which to display the characters in the line) is determined by
   looking up the first strong directional character in each line, using the CSS <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-writing-modes-4/#valdef-unicode-bidi-plaintext">plaintext</a> algorithm. In the occasional cases where the first strong character on
@@ -2334,11 +2537,11 @@
      </div>
      <p class="note" role="note">The default text alignment is <a data-link-type="dfn" href="#webvtt-cue-center-alignment" id="ref-for-webvtt-cue-center-alignment-4">center
   alignment</a> regardless of the base direction of the cue text. To make the text alignment of each
-  line match the base direction of the line (e.g. left for English, right for Hebrew), use <a data-link-type="dfn" href="#webvtt-cue-start-alignment" id="ref-for-webvtt-cue-start-alignment-4">start alignment</a>, or <a data-link-type="dfn" href="#webvtt-cue-end-alignment" id="ref-for-webvtt-cue-end-alignment-4">end
+  line match the base direction of the line (e.g. left for English, right for Hebrew), use <a data-link-type="dfn" href="#webvtt-cue-start-alignment" id="ref-for-webvtt-cue-start-alignment-5">start alignment</a>, or <a data-link-type="dfn" href="#webvtt-cue-end-alignment" id="ref-for-webvtt-cue-end-alignment-5">end
   alignment</a> for the opposite alignment.</p>
      <div class="example" id="example-73203b99">
       <a class="self-link" href="#example-73203b99"></a>
-      <p>In this example, <a data-link-type="dfn" href="#webvtt-cue-start-alignment" id="ref-for-webvtt-cue-start-alignment-5">start alignment</a> is used. The first
+      <p>In this example, <a data-link-type="dfn" href="#webvtt-cue-start-alignment" id="ref-for-webvtt-cue-start-alignment-6">start alignment</a> is used. The first
    line is left-aligned because the base direction is left-to-right, and the second line is
    right-aligned because the base direction is right-to-left.</p>
 <pre>WEBVTT
@@ -2359,23 +2562,25 @@
      <p>An optional <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-2">WebVTT region</a> to which a cue belongs.</p>
      <p>By default, the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-3">region</a> is set to null.</p>
    </dl>
-   <p>The associated <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#rules-for-updating-the-text-track-rendering">rules for updating the text track rendering</a> of <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-10">WebVTT
+   <p>The associated <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#rules-for-updating-the-text-track-rendering">rules for updating the text track rendering</a> of <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-12">WebVTT
 cues</a> are the <a data-link-type="dfn" href="#rules-for-updating-the-display-of-webvtt-text-tracks" id="ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-1">rules for updating the display of WebVTT text tracks</a>.</p>
    <div class="impl">
-    <p>When a <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-11">WebVTT cue</a> whose <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-cue-active-flag">active flag</a> is set has its <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-11">writing direction</a>, <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-8">snap-to-lines flag</a>, <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-20">line</a>, <a data-link-type="dfn" href="#webvtt-cue-line-alignment" id="ref-for-webvtt-cue-line-alignment-4">line alignment</a>, <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-19">position</a>, <a data-link-type="dfn" href="#webvtt-cue-position-alignment" id="ref-for-webvtt-cue-position-alignment-6">position alignment</a>, <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-6">size</a>, <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-12">text alignment</a>, <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-1">region</a>, or <a data-link-type="dfn" href="#text-track-cue-text" id="ref-for-text-track-cue-text-1">text</a> change value, then the user agent must empty the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-cue-display-state">text track cue display
- state</a>, and then immediately run the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text track</a>’s <a data-link-type="dfn" href="#rules-for-updating-the-display-of-webvtt-text-tracks" id="ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-2">rules for updating the display of
- WebVTT text tracks</a>.</p>
+    <p>When a <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-13">WebVTT cue</a> whose <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-cue-active-flag">active flag</a> is set has its <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-11">writing direction</a>, <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-7">snap-to-lines flag</a>, <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-20">line</a>, <a data-link-type="dfn" href="#webvtt-cue-line-alignment" id="ref-for-webvtt-cue-line-alignment-4">line alignment</a>, <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-19">position</a>, <a data-link-type="dfn" href="#webvtt-cue-position-alignment" id="ref-for-webvtt-cue-position-alignment-6">position alignment</a>, <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-6">size</a>, <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-14">text alignment</a>, <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-1">region</a>, or <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-3">text</a> change value, then the user agent must empty the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-cue-display-state">text track cue display state</a>, and then
+ immediately run the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text track</a>’s <a data-link-type="dfn" href="#rules-for-updating-the-display-of-webvtt-text-tracks" id="ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-2">rules for updating the display of WebVTT text
+ tracks</a>.</p>
    </div>
-   <h3 class="heading settled" data-level="3.2" id="regions"><span class="secno">3.2. </span><span class="content">WebVTT regions</span><a class="self-link" href="#regions"></a></h3>
-   <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-region">WebVTT region</dfn> represents a subpart of the video viewport and provides a rendering
-area for <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-12">WebVTT cues</a>.</p>
+   <h3 class="heading settled" data-level="3.4" id="regions"><span class="secno">3.4. </span><span class="content">WebVTT caption or subtitle regions</span><a class="self-link" href="#regions"></a></h3>
+   <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-region">WebVTT region</dfn> represents a subpart of the video viewport and provides a limited
+rendering area for <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue" id="ref-for-webvtt-caption-or-subtitle-cue-1">WebVTT caption or subtitle cues</a>.</p>
+   <p class="note" role="note">Regions provide a means to group caption or subtitle cues so the cues can be rendered
+together, which is particularly important when scrolling up.</p>
    <p>Each <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-4">WebVTT region</a> consists of:</p>
    <dl>
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT region identifier" data-noexport="" id="webvtt-region-identifier">An identifier</dfn>
     <dd>
-     <p>An arbitrary string of one or more characters other than U+0020 SPACE or U+0009 CHARACTER
+     <p>An arbitrary string of zero or more characters other than U+0020 SPACE or U+0009 CHARACTER
   TABULATION character. The string must not contain the substring "-->" (U+002D HYPHEN-MINUS, U+002D
-  HYPHEN-MINUS, U+003E GREATER-THAN SIGN). An identifier is required for a region to exist.</p>
+  HYPHEN-MINUS, U+003E GREATER-THAN SIGN). Defaults to the empty string.</p>
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT region width" data-noexport="" id="webvtt-region-width">A width</dfn>
     <dd>
      <p>A number giving the width of the box within which the text of each line of the containing cues
@@ -2384,6 +2589,9 @@
     <dd>
      <p>A number giving the number of lines of the box within which the text of each line of the
   containing cues is to be rendered. Defaults to 3.</p>
+     <p class="note" role="note">Since a WebVTT region defines a fixed rendering area, a cue that has more lines
+  than the region allows will be clipped. For scrolling regions, the clipping happens at the top,
+  for non-scrolling regions it happens at the bottom.</p>
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT region anchor" data-noexport="" id="webvtt-region-anchor">A region anchor point</dfn>
     <dd>
      <p>Two numbers giving the x and y coordinates within the region which is anchored to the video
@@ -2392,7 +2600,7 @@
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT region viewport anchor" data-noexport="" id="webvtt-region-viewport-anchor">A region viewport anchor point</dfn>
     <dd>
      <p>Two numbers giving the x and y coordinates within the video viewport to which the region anchor
-  point is anchored. Defaults to (0,100), i.e. the bottom left corner of the viewport.</p>
+  point is anchored. Defaults to (0,100), i.e. the bottom left corner of the video viewport.</p>
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT region scroll" data-noexport="" id="webvtt-region-scroll">A scroll value</dfn>
     <dd>
      <p>One of the following:</p>
@@ -2409,14 +2617,15 @@
    <div class="note" role="note">
     <p>The following diagram illustrates how anchoring of a region to a video viewport works. The black
  cross is the anchor, orange explains the anchor’s offset within the region and green the anchor’s
- offset within the viewport. Think of it as sticking a pin through a note onto a board:</p>
-    <p><img alt="Within the video viewport, there is a WebVTT region.
+ offset within the video viewport. Think of it as sticking a pin through a note onto a board:</p>
+    <p><img alt="visual explanation of WebVTT regions" longdesc="#regionsExplained" src="webvtt-region-diagram.png"></p>
+    <p id="regionsExplained">Image description: Within the video viewport, there is a WebVTT region.
  Inside the region, there is an anchor point marked with a black cross. The vertical and horizontal
  distance from the video viewport’s edges to the anchor is marked with green arrows, representing
  the region viewport anchor X and Y offsets. The vertical and horizontal distance from the region’s
  edges to the anchor is marked with orange arrows, representing the region anchor X and Y offsets.
  The size of the region is represented by the region width for the horizontal axis, and region lines
- for the vertical axis." src="webvtt-region-diagram.png"></p>
+ for the vertical axis.</p>
    </div>
    <p>For parsing, we also need the following:</p>
    <dl>
@@ -2424,12 +2633,21 @@
     <dd>
      <p>A list of zero or more <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-5">WebVTT regions</a>.</p>
    </dl>
+   <h3 class="heading settled" data-level="3.5" id="chapter-cues"><span class="secno">3.5. </span><span class="content">WebVTT chapter cues</span><a class="self-link" href="#chapter-cues"></a></h3>
+   <p>A <dfn data-dfn-type="dfn" data-noexport="" id="webvtt-chapter-cue">WebVTT chapter cue<a class="self-link" href="#webvtt-chapter-cue"></a></dfn> is a <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-14">WebVTT cue</a> whose <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-4">cue text</a> is interpreted as a
+chapter title that describes the chapter as a navigation target.</p>
+   <p>Chapter cues mark up the timeline of a audio or video file in consecutive, non-overlapping
+intervals. It is further possible to subdivide these intervals into sub-chapters building a
+navigation tree.</p>
+   <h3 class="heading settled" data-level="3.6" id="metadata-cues"><span class="secno">3.6. </span><span class="content">WebVTT metadata cues</span><a class="self-link" href="#metadata-cues"></a></h3>
+   <p>A <dfn data-dfn-type="dfn" data-noexport="" id="webvtt-metadata-cue">WebVTT metadata cue<a class="self-link" href="#webvtt-metadata-cue"></a></dfn> is a <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-15">WebVTT cue</a> whose <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-5">cue text</a> is interpreted as
+time-aligned metadata.</p>
    <h2 class="heading settled" data-level="4" id="syntax"><span class="secno">4. </span><span class="content">Syntax</span><a class="self-link" href="#syntax"></a></h2>
    <h3 class="heading settled" data-level="4.1" id="file-structure"><span class="secno">4.1. </span><span class="content">WebVTT file structure</span><a class="self-link" href="#file-structure"></a></h3>
    <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-file">WebVTT file</dfn> must consist of a <a data-link-type="dfn" href="#webvtt-file-body" id="ref-for-webvtt-file-body-1">WebVTT file body</a> encoded as UTF-8 and labeled
 with the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#mime-type">MIME type</a> <code>text/vtt</code>. <a data-link-type="biblio" href="#biblio-rfc3629">[RFC3629]</a></p>
    <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-file-body">WebVTT file body</dfn> consists of the following components, in the following order:</p>
-   <ol class="algorithm">
+   <ol class="algorithm" data-algorithm="WebVTT file body">
     <li>An optional U+FEFF BYTE ORDER MARK (BOM) character.
     <li>The string "<code>WEBVTT</code>".
     <li>Optionally, either a U+0020 SPACE character or a U+0009 CHARACTER TABULATION (tab) character
@@ -2481,8 +2699,9 @@
     <li>Optionally, one or more U+0020 SPACE characters or U+0009 CHARACTER TABULATION (tab) characters
  followed by a <a data-link-type="dfn" href="#webvtt-cue-settings-list" id="ref-for-webvtt-cue-settings-list-1">WebVTT cue settings list</a>.
     <li>A <a data-link-type="dfn" href="#webvtt-line-terminator" id="ref-for-webvtt-line-terminator-12">WebVTT line terminator</a>.
-    <li>The <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="cue-payload">cue payload</dfn>: either <a data-link-type="dfn" href="#webvtt-cue-text" id="ref-for-webvtt-cue-text-2">WebVTT cue text</a>, <a data-link-type="dfn" href="#webvtt-chapter-title-text" id="ref-for-webvtt-chapter-title-text-1">WebVTT chapter title text</a>, or <a data-link-type="dfn" href="#webvtt-metadata-text" id="ref-for-webvtt-metadata-text-1">WebVTT metadata text</a>, but it must not contain the substring "<code>--></code>" (U+002D
- HYPHEN-MINUS, U+002D HYPHEN-MINUS, U+003E GREATER-THAN SIGN).
+    <li>The <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="cue-payload">cue payload</dfn>: either <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-text" id="ref-for-webvtt-caption-or-subtitle-cue-text-2">WebVTT caption or subtitle cue text</a>, <a data-link-type="dfn" href="#webvtt-chapter-title-text" id="ref-for-webvtt-chapter-title-text-1">WebVTT
+ chapter title text</a>, or <a data-link-type="dfn" href="#webvtt-metadata-text" id="ref-for-webvtt-metadata-text-1">WebVTT metadata text</a>, but it must not contain the substring
+ "<code>--></code>" (U+002D HYPHEN-MINUS, U+002D HYPHEN-MINUS, U+003E GREATER-THAN SIGN).
     <li>A <a data-link-type="dfn" href="#webvtt-line-terminator" id="ref-for-webvtt-line-terminator-13">WebVTT line terminator</a>.
    </ol>
    <p class="note" role="note">A <a data-link-type="dfn" href="#webvtt-cue-block" id="ref-for-webvtt-cue-block-2">WebVTT cue block</a> corresponds to one piece of time-aligned text or data in
@@ -2491,7 +2710,7 @@
    <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-cue-identifier">WebVTT cue identifier</dfn> is any sequence of one or more characters not containing the
 substring "<code>--></code>" (U+002D HYPHEN-MINUS, U+002D HYPHEN-MINUS, U+003E GREATER-THAN SIGN),
 nor containing any U+000A LINE FEED (LF) characters or U+000D CARRIAGE RETURN (CR) characters.</p>
-   <p>A <a data-link-type="dfn" href="#webvtt-cue-identifier" id="ref-for-webvtt-cue-identifier-2">WebVTT cue identifier</a> must be unique amongst all the <a data-link-type="dfn" href="#webvtt-cue-identifier" id="ref-for-webvtt-cue-identifier-3">WebVTT cue identifiers</a> of all <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-13">WebVTT cues</a> of a <a data-link-type="dfn" href="#webvtt-file" id="ref-for-webvtt-file-8">WebVTT
+   <p>A <a data-link-type="dfn" href="#webvtt-cue-identifier" id="ref-for-webvtt-cue-identifier-2">WebVTT cue identifier</a> must be unique amongst all the <a data-link-type="dfn" href="#webvtt-cue-identifier" id="ref-for-webvtt-cue-identifier-3">WebVTT cue identifiers</a> of all <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-16">WebVTT cues</a> of a <a data-link-type="dfn" href="#webvtt-file" id="ref-for-webvtt-file-8">WebVTT
 file</a>.</p>
    <p class="note" role="note">A <a data-link-type="dfn" href="#webvtt-cue-identifier" id="ref-for-webvtt-cue-identifier-4">WebVTT cue identifier</a> can be used to reference a specific cue, for example
 from script or CSS.</p>
@@ -2519,10 +2738,10 @@
       <li>A U+003A COLON character (:)
      </ol>
     <li>Two <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#ascii-digits">ASCII digits</a>, representing the <var>minutes</var> as a base ten integer in the range
- 0 ≤ <var>minutes</var> ≤ 59.
+ 0 ≤ <var>minutes</var> ≤ 59.
     <li>A U+003A COLON character (:)
     <li>Two <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#ascii-digits">ASCII digits</a>, representing the <var>seconds</var> as a base ten integer in the range
- 0 ≤ <var>seconds</var> ≤ 59.
+ 0 ≤ <var>seconds</var> ≤ 59.
     <li>A U+002E FULL STOP character (.).
     <li>Three <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#ascii-digits">ASCII digits</a>, representing the thousandths of a second <var>seconds-frac</var> as a base
  ten integer.
@@ -2582,12 +2801,12 @@
 separated from the next by a <a data-link-type="dfn" href="#webvtt-line-terminator" id="ref-for-webvtt-line-terminator-17">WebVTT line terminator</a>. (In other words, any text that does not
 have two consecutive <a data-link-type="dfn" href="#webvtt-line-terminator" id="ref-for-webvtt-line-terminator-18">WebVTT line terminators</a> and does not start
 or end with a <a data-link-type="dfn" href="#webvtt-line-terminator" id="ref-for-webvtt-line-terminator-19">WebVTT line terminator</a>.)</p>
-   <p><a data-link-type="dfn" href="#webvtt-metadata-text" id="ref-for-webvtt-metadata-text-2">WebVTT metadata text</a> cues are only useful for scripted applications (using the <code>metadata</code> <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#kind-of-track">text track kind</a>).</p>
-   <h4 class="heading settled" data-level="4.2.2" id="cue-text"><span class="secno">4.2.2. </span><span class="content">WebVTT cue text</span><a class="self-link" href="#cue-text"></a></h4>
-   <p><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-cue-text">WebVTT cue text</dfn> is <a data-link-type="dfn" href="#cue-payload" id="ref-for-cue-payload-2">cue payload</a> that consists of zero or more <a data-link-type="dfn" href="#webvtt-cue-components" id="ref-for-webvtt-cue-components-1">WebVTT cue
-components</a>, in any order, each optionally separated from the next by a <a data-link-type="dfn" href="#webvtt-line-terminator" id="ref-for-webvtt-line-terminator-20">WebVTT line
-terminator</a>.</p>
-   <p>The <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-cue-components">WebVTT cue components</dfn> are:</p>
+   <p><a data-link-type="dfn" href="#webvtt-metadata-text" id="ref-for-webvtt-metadata-text-2">WebVTT metadata text</a> cues are only useful for scripted applications (e.g. using the <code>metadata</code> <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#kind-of-track">text track kind</a> in a HTML <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text track</a>).</p>
+   <h4 class="heading settled" data-level="4.2.2" id="caption-text"><span class="secno">4.2.2. </span><span class="content">WebVTT caption or subtitle cue text</span><a class="self-link" href="#caption-text"></a></h4>
+   <p><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-caption-or-subtitle-cue-text">WebVTT caption or subtitle cue text</dfn> is <a data-link-type="dfn" href="#cue-payload" id="ref-for-cue-payload-2">cue payload</a> that consists of zero or
+more <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-components" id="ref-for-webvtt-caption-or-subtitle-cue-components-1">WebVTT caption or subtitle cue components</a>, in any order, each optionally separated from
+the next by a <a data-link-type="dfn" href="#webvtt-line-terminator" id="ref-for-webvtt-line-terminator-20">WebVTT line terminator</a>.</p>
+   <p>The <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-caption-or-subtitle-cue-components">WebVTT caption or subtitle cue components</dfn> are:</p>
    <ul>
     <li>A <a data-link-type="dfn" href="#webvtt-cue-class-span" id="ref-for-webvtt-cue-class-span-1">WebVTT cue class span</a>.
     <li>A <a data-link-type="dfn" href="#webvtt-cue-italics-span" id="ref-for-webvtt-cue-italics-span-1">WebVTT cue italics span</a>.
@@ -2601,8 +2820,13 @@
     <li>An <a data-link-type="dfn" href="https://www.w3.org/TR/html51/syntax.html#character-references">HTML character reference</a>, representing one or two Unicode
  code points, as defined in HTML, in the text of the cue. <a data-link-type="biblio" href="#biblio-html51">[HTML51]</a>
    </ul>
+   <p>All <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-components" id="ref-for-webvtt-caption-or-subtitle-cue-components-2">WebVTT caption or subtitle cue components</a> bar the HTML character reference may have
+one or more <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="cue-component-class-names">cue component class names</dfn> attached to it by separating the cue component
+class name from the cue component start tag using the perido ('.') notation. The class name must
+immediately follow the "period" (.).</p>
    <p><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-cue-internal-text">WebVTT cue internal text</dfn> consists of an optional <a data-link-type="dfn" href="#webvtt-line-terminator" id="ref-for-webvtt-line-terminator-21">WebVTT line terminator</a>,
-followed by zero or more <a data-link-type="dfn" href="#webvtt-cue-components" id="ref-for-webvtt-cue-components-2">WebVTT cue components</a>, in any order, each optionally followed by a <a data-link-type="dfn" href="#webvtt-line-terminator" id="ref-for-webvtt-line-terminator-22">WebVTT line terminator</a>.</p>
+followed by zero or more <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-components" id="ref-for-webvtt-caption-or-subtitle-cue-components-3">WebVTT caption or subtitle cue components</a>, in any order, each
+optionally followed by a <a data-link-type="dfn" href="#webvtt-line-terminator" id="ref-for-webvtt-line-terminator-22">WebVTT line terminator</a>.</p>
    <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-cue-class-span">WebVTT cue class span</dfn> consists of a <a data-link-type="dfn" href="#webvtt-cue-span-start-tag" id="ref-for-webvtt-cue-span-start-tag-1">WebVTT cue span start tag</a> "<code>c</code>" that disallows an annotation, <a data-link-type="dfn" href="#webvtt-cue-internal-text" id="ref-for-webvtt-cue-internal-text-1">WebVTT cue internal text</a> representing cue
 text, and a <a data-link-type="dfn" href="#webvtt-cue-span-end-tag" id="ref-for-webvtt-cue-span-end-tag-1">WebVTT cue span end tag</a> "<code>c</code>".</p>
    <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-cue-italics-span">WebVTT cue italics span</dfn> consists of a <a data-link-type="dfn" href="#webvtt-cue-span-start-tag" id="ref-for-webvtt-cue-span-start-tag-2">WebVTT cue span start tag</a> "<code>i</code>" that disallows an annotation, <a data-link-type="dfn" href="#webvtt-cue-internal-text" id="ref-for-webvtt-cue-internal-text-2">WebVTT cue internal text</a> representing the
@@ -2642,8 +2866,8 @@
  represents the name of the voice.
     <li><a data-link-type="dfn" href="#webvtt-cue-internal-text" id="ref-for-webvtt-cue-internal-text-7">WebVTT cue internal text</a>.
     <li>A <a data-link-type="dfn" href="#webvtt-cue-span-end-tag" id="ref-for-webvtt-cue-span-end-tag-7">WebVTT cue span end tag</a> "<code>v</code>". If this <a data-link-type="dfn" href="#webvtt-cue-voice-span" id="ref-for-webvtt-cue-voice-span-2">WebVTT cue voice span</a> is the
- only <a data-link-type="dfn" href="#webvtt-cue-components" id="ref-for-webvtt-cue-components-3">component</a> of its <a data-link-type="dfn" href="#webvtt-cue-text" id="ref-for-webvtt-cue-text-3">WebVTT cue text</a> sequence, then the
- end tag may be omitted for brevity.
+ only <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-components" id="ref-for-webvtt-caption-or-subtitle-cue-components-4">component</a> of its <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-text" id="ref-for-webvtt-caption-or-subtitle-cue-text-3">WebVTT caption or
+ subtitle cue text</a> sequence, then the end tag may be omitted for brevity.
    </ol>
    <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-cue-language-span">WebVTT cue language span</dfn> consists of the following components, in the order
 given:</p>
@@ -2705,13 +2929,21 @@
    <p><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-cue-span-start-tag-annotation-text">WebVTT cue span start tag annotation text</dfn> consists of one or more characters other
 than U+000A LINE FEED (LF) characters, U+000D CARRIAGE RETURN (CR) characters, U+0026 AMPERSAND
 characters (&amp;), and U+003E GREATER-THAN SIGN characters (>).</p>
+   <h4 class="heading settled" data-level="4.2.3" id="chapter-title-text"><span class="secno">4.2.3. </span><span class="content">WebVTT chapter title text</span><a class="self-link" href="#chapter-title-text"></a></h4>
+   <p><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-chapter-title-text">WebVTT chapter title text</dfn> is <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-6">cue text</a> that makes use of zero or more of the
+following components, each optionally separated from the next by a <a data-link-type="dfn" href="#webvtt-line-terminator" id="ref-for-webvtt-line-terminator-25">WebVTT line
+terminator</a>:</p>
+   <ul>
+    <li><a data-link-type="dfn" href="#webvtt-cue-text-span" id="ref-for-webvtt-cue-text-span-2">WebVTT cue text span</a>
+    <li><a data-link-type="dfn" href="https://www.w3.org/TR/html51/syntax.html#character-references">HTML character reference</a> <a data-link-type="biblio" href="#biblio-html51">[HTML51]</a>
+   </ul>
    <h3 class="heading settled" data-level="4.3" id="region-settings"><span class="secno">4.3. </span><span class="content">WebVTT region settings</span><a class="self-link" href="#region-settings"></a></h3>
    <p>A <a data-link-type="dfn" href="#webvtt-cue-settings-list" id="ref-for-webvtt-cue-settings-list-2">WebVTT cue settings list</a> can contain a reference to a <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-6">WebVTT region</a>. To define a
 region, a <a data-link-type="dfn" href="#webvtt-region-definition-block" id="ref-for-webvtt-region-definition-block-2">WebVTT region definition block</a> is specified.</p>
    <p>The <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-region-settings-list">WebVTT region settings list</dfn> consists of zero or more of the following components,
 in any order, separated from each other by one or more U+0020 SPACE characters, U+0009 CHARACTER
-TABULATION (tab) characters, or <a data-link-type="dfn" href="#webvtt-line-terminator" id="ref-for-webvtt-line-terminator-25">WebVTT line terminators</a>, except that the string must not
-contain two consecutive <a data-link-type="dfn" href="#webvtt-line-terminator" id="ref-for-webvtt-line-terminator-26">WebVTT line terminators</a>. Each component must not be included more
+TABULATION (tab) characters, or <a data-link-type="dfn" href="#webvtt-line-terminator" id="ref-for-webvtt-line-terminator-26">WebVTT line terminators</a>, except that the string must not
+contain two consecutive <a data-link-type="dfn" href="#webvtt-line-terminator" id="ref-for-webvtt-line-terminator-27">WebVTT line terminators</a>. Each component must not be included more
 than once per <a data-link-type="dfn" href="#webvtt-region-settings-list" id="ref-for-webvtt-region-settings-list-2">WebVTT region settings list</a> string.</p>
    <ul>
     <li>A <a data-link-type="dfn" href="#webvtt-region-identifier-setting" id="ref-for-webvtt-region-identifier-setting-1">WebVTT region identifier setting</a>.
@@ -2738,9 +2970,10 @@
  GREATER-THAN SIGN).</p>
    </ol>
    <p>A <a data-link-type="dfn" href="#webvtt-region-identifier-setting" id="ref-for-webvtt-region-identifier-setting-2">WebVTT region identifier setting</a> must be unique amongst all the <a data-link-type="dfn" href="#webvtt-region-identifier-setting" id="ref-for-webvtt-region-identifier-setting-3">WebVTT region identifier settings</a> of all <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-7">WebVTT
-regions</a> of a <a data-link-type="dfn" href="#webvtt-file" id="ref-for-webvtt-file-9">WebVTT file</a>. For a region to exist, a region identifier setting has to be
-provided.</p>
-   <p class="note" role="note">The <a data-link-type="dfn" href="#webvtt-region-identifier-setting" id="ref-for-webvtt-region-identifier-setting-4">WebVTT region identifier setting</a> gives a name to the region so it can be
+regions</a> of a <a data-link-type="dfn" href="#webvtt-file" id="ref-for-webvtt-file-9">WebVTT file</a>.</p>
+   <p>A <a data-link-type="dfn" href="#webvtt-region-identifier-setting" id="ref-for-webvtt-region-identifier-setting-4">WebVTT region identifier setting</a> must be present in each <a data-link-type="dfn" href="#webvtt-cue-settings-list" id="ref-for-webvtt-cue-settings-list-3">WebVTT cue settings
+list</a>. Without an identifier, it is not possible to associate a <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-17">WebVTT cue</a> with a <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-8">WebVTT region</a> in the syntax.</p>
+   <p class="note" role="note">The <a data-link-type="dfn" href="#webvtt-region-identifier-setting" id="ref-for-webvtt-region-identifier-setting-5">WebVTT region identifier setting</a> gives a name to the region so it can be
 referenced by the cues that belong to the region.</p>
    <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-region-width-setting">WebVTT region width setting</dfn> consists of the following components, in the order
 given:</p>
@@ -2803,8 +3036,8 @@
    <p class="note" role="note">The <a data-link-type="dfn" href="#webvtt-region-viewport-anchor-setting" id="ref-for-webvtt-region-viewport-anchor-setting-2">WebVTT region viewport anchor setting</a> provides a tuple of two percentages
 that specify the point within the video viewport that the region anchor point is anchored to. The
 first percentage measures the x-dimension and the second percentage measures the y-dimension from
-the top left corner of the video viewport box. If no viewport anchor is given, it defaults to 0%,
-100% (i.e. the bottom left corner).</p>
+the top left corner of the video viewport box. If no region viewport anchor is given, it defaults to
+0%, 100% (i.e. the bottom left corner).</p>
    <p class="note" role="note">For browsers, the region maps to an absolute positioned CSS box relative to the
 video viewport, i.e. there is a relative positioned box that represents the video viewport relative
 to which the regions are absolutely positioned. Overflow is hidden.</p>
@@ -2832,8 +3065,13 @@
 the line in the bottom of the region. If no empty line is available, the oldest line is
 replaced.</p>
    <h3 class="heading settled" data-level="4.4" id="cue-settings"><span class="secno">4.4. </span><span class="content">WebVTT cue settings</span><a class="self-link" href="#cue-settings"></a></h3>
-   <p>A <a data-link-type="dfn" href="#webvtt-cue-settings-list" id="ref-for-webvtt-cue-settings-list-3">WebVTT cue settings list</a> consists of zero or more of the following settings. Each
-setting must not be included more than once per <a data-link-type="dfn" href="#webvtt-cue-settings-list" id="ref-for-webvtt-cue-settings-list-4">WebVTT cue settings list</a>.</p>
+   <p>A <a data-link-type="dfn" href="#webvtt-cue-setting" id="ref-for-webvtt-cue-setting-1">WebVTT cue setting</a> is part of a <a data-link-type="dfn" href="#webvtt-cue-settings-list" id="ref-for-webvtt-cue-settings-list-4">WebVTT cue settings list</a> and provides
+configuration options regarding the position and alignment of the cue box and the cue text
+within.</p>
+   <p class="note" role="note">For example, a set of WebVTT cue settings may allow a cue box to be aligned to the
+left or positioned at the top right with the cue text within center aligned.</p>
+   <p>The current available <a data-link-type="dfn" href="#webvtt-cue-setting" id="ref-for-webvtt-cue-setting-2">WebVTT cue settings</a> that may appear in a <a data-link-type="dfn" href="#webvtt-cue-settings-list" id="ref-for-webvtt-cue-settings-list-5">WebVTT cue settings
+list</a> are:</p>
    <ul class="brief">
     <li>A <a data-link-type="dfn" href="#webvtt-vertical-text-cue-setting" id="ref-for-webvtt-vertical-text-cue-setting-1">WebVTT vertical text cue setting</a>.
     <li>A <a data-link-type="dfn" href="#webvtt-line-cue-setting" id="ref-for-webvtt-line-cue-setting-1">WebVTT line cue setting</a>.
@@ -2842,10 +3080,9 @@
     <li>A <a data-link-type="dfn" href="#webvtt-alignment-cue-setting" id="ref-for-webvtt-alignment-cue-setting-1">WebVTT alignment cue setting</a>.
     <li>A <a data-link-type="dfn" href="#webvtt-region-cue-setting" id="ref-for-webvtt-region-cue-setting-1">WebVTT region cue setting</a>.
    </ul>
-   <p class="note" role="note">A <a data-link-type="dfn" href="#webvtt-cue-settings-list" id="ref-for-webvtt-cue-settings-list-5">WebVTT cue settings list</a> gives configuration options regarding the position
-and alignment of the cue box and the cue text within. For example, it allows a cue box to be aligned
-to the left or positioned at the top right with the cue text within center aligned.</p>
+   <p>Each of these setting must not be included more than once per <a data-link-type="dfn" href="#webvtt-cue-settings-list" id="ref-for-webvtt-cue-settings-list-6">WebVTT cue settings
+list</a>.</p>
+   <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-vertical-text-cue-setting">WebVTT vertical text cue setting</dfn> is a <a data-link-type="dfn" href="#webvtt-cue-setting" id="ref-for-webvtt-cue-setting-3">WebVTT cue setting</a> that consists of the
-   <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-vertical-text-cue-setting">WebVTT vertical text cue setting</dfn> is a <a data-link-type="dfn" href="#webvtt-cue-setting" id="ref-for-webvtt-cue-setting-1">WebVTT cue setting</a> that consists of the
 following components, in the order given:</p>
    <ol>
     <li>The string "<code>vertical</code>" as the <a data-link-type="dfn" href="#webvtt-cue-setting-name" id="ref-for-webvtt-cue-setting-name-2">WebVTT cue setting name</a>.
@@ -2890,13 +3127,13 @@
      </ol>
    </ol>
    <p class="note" role="note">A <a data-link-type="dfn" href="#webvtt-line-cue-setting" id="ref-for-webvtt-line-cue-setting-2">WebVTT line cue setting</a> configures the offset of the cue box from the video
-viewport’s edge in the direction opposite to the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-12">writing
-direction</a>. For horizontal cues, this is the vertical offset from the top of the video viewport.
-The offset is for the <a data-link-type="dfn" href="#webvtt-cue-line-start-alignment" id="ref-for-webvtt-cue-line-start-alignment-2">start</a>, <a data-link-type="dfn" href="#webvtt-cue-line-center-alignment" id="ref-for-webvtt-cue-line-center-alignment-1">center</a>, or <a data-link-type="dfn" href="#webvtt-cue-line-end-alignment" id="ref-for-webvtt-cue-line-end-alignment-1">end</a> of the cue box,
-depending on the <a data-link-type="dfn" href="#webvtt-cue-line-alignment" id="ref-for-webvtt-cue-line-alignment-5">WebVTT cue line alignment</a> value - <a data-link-type="dfn" href="#webvtt-cue-line-start-alignment" id="ref-for-webvtt-cue-line-start-alignment-3">start</a> by default. The offset can be given either as a percentage of the video
-dimension or as a line number. Line numbers are based on the size of the first line of the cue.
-Positive line numbers count from the start of the video viewport (the first line is numbered 0),
-negative line numbers from the end of the viewport (the last line is numbered −1).</p>
+viewport’s edge in the direction orthogonal to the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-12">writing
+direction</a>. For horizontal cues, this is the vertical offset from the top of the video viewport,
+for vertical cues, it’s the horizontal offset. The offset is for the <a data-link-type="dfn" href="#webvtt-cue-line-start-alignment" id="ref-for-webvtt-cue-line-start-alignment-2">start</a>, <a data-link-type="dfn" href="#webvtt-cue-line-center-alignment" id="ref-for-webvtt-cue-line-center-alignment-1">center</a>, or <a data-link-type="dfn" href="#webvtt-cue-line-end-alignment" id="ref-for-webvtt-cue-line-end-alignment-1">end</a> of the cue box, depending on the <a data-link-type="dfn" href="#webvtt-cue-line-alignment" id="ref-for-webvtt-cue-line-alignment-5">WebVTT cue line alignment</a> value - <a data-link-type="dfn" href="#webvtt-cue-line-start-alignment" id="ref-for-webvtt-cue-line-start-alignment-3">start</a> by default. The offset can be given either as a
+percentage of the relevant writing-mode dependent video viewport dimension or as a line number. Line
+numbers are based on the size of the first line of the cue. Positive line numbers count from the
+start of the video viewport (the first line is numbered 0), negative line numbers from the end of
+the video viewport (the last line is numbered −1).</p>
    <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-position-cue-setting">WebVTT position cue setting</dfn> consists of the following components, in the order
 given:</p>
    <ol>
@@ -2919,7 +3156,7 @@
    </ol>
    <p class="note" role="note">A <a data-link-type="dfn" href="#webvtt-position-cue-setting" id="ref-for-webvtt-position-cue-setting-2">WebVTT position cue setting</a> configures the indent position of the <a data-link-type="dfn" href="#webvtt-cue-box" id="ref-for-webvtt-cue-box-24">cue box</a> in the direction orthogonal to the <a data-link-type="dfn" href="#webvtt-line-cue-setting" id="ref-for-webvtt-line-cue-setting-3">WebVTT line cue setting</a>.
 For horizontal cues, this is the horizontal position. The cue position is given as a percentage of
-the video viewport. The positioning is for the <a data-link-type="dfn" href="#webvtt-cue-position-line-left-alignment" id="ref-for-webvtt-cue-position-line-left-alignment-3">line-left</a>, <a data-link-type="dfn" href="#webvtt-cue-position-center-alignment" id="ref-for-webvtt-cue-position-center-alignment-1">center</a>, or <a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-2">line-right</a> of the cue box, depending on the cue’s <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-1">computed position alignment</a>, which is overridden by the <a data-link-type="dfn" href="#webvtt-position-cue-setting" id="ref-for-webvtt-position-cue-setting-3">WebVTT
+the video viewport. The positioning is for the <a data-link-type="dfn" href="#webvtt-cue-position-line-left-alignment" id="ref-for-webvtt-cue-position-line-left-alignment-5">line-left</a>, <a data-link-type="dfn" href="#webvtt-cue-position-center-alignment" id="ref-for-webvtt-cue-position-center-alignment-1">center</a>, or <a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-4">line-right</a> of the cue box, depending on the cue’s <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-1">computed position alignment</a>, which is overridden by the <a data-link-type="dfn" href="#webvtt-position-cue-setting" id="ref-for-webvtt-position-cue-setting-3">WebVTT
 position cue setting</a>.</p>
    <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-size-cue-setting">WebVTT size cue setting</dfn> consists of the following components, in the order
 given:</p>
@@ -2933,7 +3170,7 @@
    </ol>
    <p class="note" role="note">A <a data-link-type="dfn" href="#webvtt-size-cue-setting" id="ref-for-webvtt-size-cue-setting-2">WebVTT size cue setting</a> configures the size of the <a data-link-type="dfn" href="#webvtt-cue-box" id="ref-for-webvtt-cue-box-25">cue box</a> in the same direction as the <a data-link-type="dfn" href="#webvtt-position-cue-setting" id="ref-for-webvtt-position-cue-setting-4">WebVTT position cue setting</a>. For horizontal
 cues, this is the width of the <a data-link-type="dfn" href="#webvtt-cue-box" id="ref-for-webvtt-cue-box-26">cue box</a>. It is given as a percentage of
-the width of the viewport.</p>
+the width of the video viewport.</p>
    <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-alignment-cue-setting">WebVTT alignment cue setting</dfn> consists of the following components, in the order
 given:</p>
    <ol>
@@ -2957,9 +3194,11 @@
     <li>
      <p>As the <a data-link-type="dfn" href="#webvtt-cue-setting-value" id="ref-for-webvtt-cue-setting-value-7">WebVTT cue setting value</a>: a <a data-link-type="dfn" href="#webvtt-region-identifier" id="ref-for-webvtt-region-identifier-1">WebVTT region identifier</a>.</p>
    </ol>
-   <p class="note" role="note">A <a data-link-type="dfn" href="#webvtt-region-cue-setting" id="ref-for-webvtt-region-cue-setting-2">WebVTT region cue setting</a> configures a cue to become part of a region by
-referencing the region’s identifier unless the cue has a <a data-link-type="dfn" href="#webvtt-vertical-text-cue-setting" id="ref-for-webvtt-vertical-text-cue-setting-3">"vertical"</a>, <a data-link-type="dfn" href="#webvtt-line-cue-setting" id="ref-for-webvtt-line-cue-setting-4">"line"</a> or <a data-link-type="dfn" href="#webvtt-size-cue-setting" id="ref-for-webvtt-size-cue-setting-3">"size"</a> cue setting. If a cue is part of a region, its cue settings for <a data-link-type="dfn" href="#webvtt-position-cue-setting" id="ref-for-webvtt-position-cue-setting-5">"position"</a> and <a data-link-type="dfn" href="#webvtt-alignment-cue-setting" id="ref-for-webvtt-alignment-cue-setting-3">"align"</a> are
-applied to the line boxes in the cue relative to the region box.</p>
+   <p>A <a data-link-type="dfn" href="#webvtt-region-cue-setting" id="ref-for-webvtt-region-cue-setting-2">WebVTT region cue setting</a> configures a cue to become part of a region by referencing the
+region’s identifier unless the cue has a <a data-link-type="dfn" href="#webvtt-vertical-text-cue-setting" id="ref-for-webvtt-vertical-text-cue-setting-3">"vertical"</a>, <a data-link-type="dfn" href="#webvtt-line-cue-setting" id="ref-for-webvtt-line-cue-setting-4">"line"</a> or <a data-link-type="dfn" href="#webvtt-size-cue-setting" id="ref-for-webvtt-size-cue-setting-3">"size"</a> cue setting.
+If a cue is part of a region, its cue settings for <a data-link-type="dfn" href="#webvtt-position-cue-setting" id="ref-for-webvtt-position-cue-setting-5">"position"</a> and <a data-link-type="dfn" href="#webvtt-alignment-cue-setting" id="ref-for-webvtt-alignment-cue-setting-3">"align"</a> are applied to the line
+boxes in the cue relative to the region box and the cue box width and height are calculated relative
+to the region dimensions rather than the viewport dimensions.</p>
    <h3 class="heading settled" data-level="4.5" id="properties-of-cue-sequences"><span class="secno">4.5. </span><span class="content">Properties of cue sequences</span><a class="self-link" href="#properties-of-cue-sequences"></a></h3>
    <h4 class="heading settled" data-level="4.5.1" id="file-using-only-nested-cues"><span class="secno">4.5.1. </span><span class="content">WebVTT file using only nested cues</span><a class="self-link" href="#file-using-only-nested-cues"></a></h4>
    <p>A <a data-link-type="dfn" href="#webvtt-file" id="ref-for-webvtt-file-10">WebVTT file</a> whose cues all follow the following rules is said to be a <dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT file using only nested cues" data-noexport="" id="webvtt-file-using-only-nested-cues">WebVTT file
@@ -3033,29 +3272,123 @@
    <h4 class="heading settled" data-level="4.6.1" id="file-using-metadata-content"><span class="secno">4.6.1. </span><span class="content">WebVTT file using metadata content</span><a class="self-link" href="#file-using-metadata-content"></a></h4>
    <p>A <a data-link-type="dfn" href="#webvtt-file" id="ref-for-webvtt-file-12">WebVTT file</a> whose cues all have a <a data-link-type="dfn" href="#cue-payload" id="ref-for-cue-payload-3">cue payload</a> that is <a data-link-type="dfn" href="#webvtt-metadata-text" id="ref-for-webvtt-metadata-text-3">WebVTT metadata text</a> is said to be a <dfn data-dfn-type="dfn" data-noexport="" id="webvtt-file-using-metadata-content">WebVTT file using metadata content<a class="self-link" href="#webvtt-file-using-metadata-content"></a></dfn>.</p>
    <h4 class="heading settled" data-level="4.6.2" id="file-using-chapter-title-text"><span class="secno">4.6.2. </span><span class="content">WebVTT file using chapter title text</span><a class="self-link" href="#file-using-chapter-title-text"></a></h4>
-   <p><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-chapter-title-text">WebVTT chapter title text</dfn> is <a data-link-type="dfn" href="#webvtt-cue-text" id="ref-for-webvtt-cue-text-4">WebVTT cue text</a> that makes use only of zero or
-more of the following components, each optionally separated from the next by a <a data-link-type="dfn" href="#webvtt-line-terminator" id="ref-for-webvtt-line-terminator-27">WebVTT line
-terminator</a>:</p>
-   <ul>
-    <li><a data-link-type="dfn" href="#webvtt-cue-text-span" id="ref-for-webvtt-cue-text-span-2">WebVTT cue text span</a>
-    <li><a data-link-type="dfn" href="https://www.w3.org/TR/html51/syntax.html#character-references">HTML character reference</a> <a data-link-type="biblio" href="#biblio-html51">[HTML51]</a>
-   </ul>
    <p>A <dfn data-dfn-type="dfn" data-noexport="" id="webvtt-file-using-chapter-title-text">WebVTT file using chapter title text<a class="self-link" href="#webvtt-file-using-chapter-title-text"></a></dfn> is a <a data-link-type="dfn" href="#webvtt-file-using-only-nested-cues" id="ref-for-webvtt-file-using-only-nested-cues-3">WebVTT file using only nested cues</a> whose cues all have a <a data-link-type="dfn" href="#cue-payload" id="ref-for-cue-payload-4">cue payload</a> that is <a data-link-type="dfn" href="#webvtt-chapter-title-text" id="ref-for-webvtt-chapter-title-text-2">WebVTT chapter title text</a>.</p>
-   <h4 class="heading settled" data-level="4.6.3" id="file-using-cue-text"><span class="secno">4.6.3. </span><span class="content">WebVTT file using cue text</span><a class="self-link" href="#file-using-cue-text"></a></h4>
-   <p>A <a data-link-type="dfn" href="#webvtt-file" id="ref-for-webvtt-file-13">WebVTT file</a> whose cues all have a <a data-link-type="dfn" href="#cue-payload" id="ref-for-cue-payload-5">cue payload</a> that is <a data-link-type="dfn" href="#webvtt-cue-text" id="ref-for-webvtt-cue-text-5">WebVTT cue text</a> is
-said to be a <dfn data-dfn-type="dfn" data-noexport="" id="webvtt-file-using-cue-text">WebVTT file using cue text<a class="self-link" href="#webvtt-file-using-cue-text"></a></dfn>.</p>
-   <h2 class="heading settled" data-level="5" id="parsing"><span class="secno">5. </span><span class="content">Parsing</span><a class="self-link" href="#parsing"></a></h2>
-   <h3 class="heading settled algorithm" data-algorithm="WebVTT file parsing" data-level="5.1" id="file-parsing"><span class="secno">5.1. </span><span class="content">WebVTT file parsing</span><a class="self-link" href="#file-parsing"></a></h3>
+   <h4 class="heading settled" data-level="4.6.3" id="file-using-cue-text"><span class="secno">4.6.3. </span><span class="content">WebVTT file using caption or subtitle cue text</span><a class="self-link" href="#file-using-cue-text"></a></h4>
+   <p>A <a data-link-type="dfn" href="#webvtt-file" id="ref-for-webvtt-file-13">WebVTT file</a> whose cues all have a <a data-link-type="dfn" href="#cue-payload" id="ref-for-cue-payload-5">cue payload</a> that is <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-text" id="ref-for-webvtt-caption-or-subtitle-cue-text-4">WebVTT caption or
+subtitle cue text</a> is said to be a <dfn data-dfn-type="dfn" data-noexport="" id="webvtt-file-using-caption-or-subtitle-cue-text">WebVTT file using caption or subtitle cue text<a class="self-link" href="#webvtt-file-using-caption-or-subtitle-cue-text"></a></dfn>.</p>
+   <h2 class="heading settled" data-level="5" id="default-classes"><span class="secno">5. </span><span class="content">Default classes for WebVTT Caption or Subtitle Cue Components</span><a class="self-link" href="#default-classes"></a></h2>
+   <p>Many captioning formats have simple ways of specifying a limited subset of text colors and
+background colors for text. Therefore, the WebVTT spec makes available a set of default <a data-link-type="dfn" href="#cue-component-class-names" id="ref-for-cue-component-class-names-1">cue
+component class names</a> for <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-components" id="ref-for-webvtt-caption-or-subtitle-cue-components-5">WebVTT caption or subtitle cue components</a> that authors can use
+in a standard way to mark up colored text and text background.</p>
+   <p class="note" role="note">User agents that support CSS style sheets may implement this section through adding
+User Agent stylesheets.</p>
+   <h3 class="heading settled" data-level="5.1" id="default-text-color"><span class="secno">5.1. </span><span class="content">Default text colors</span><a class="self-link" href="#default-text-color"></a></h3>
+   <p><a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-components" id="ref-for-webvtt-caption-or-subtitle-cue-components-6">WebVTT caption or subtitle cue components</a> that have one or more <a data-link-type="dfn" href="#cue-component-class-names" id="ref-for-cue-component-class-names-2">class names</a> matching those in the first cell of a row in the table below must set their <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-color-4/#propdef-color">color</a> property as <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/rendering.html#presentational-hints">presentational hints</a> to the value in the second cell of the
+row:</p>
+   <table class="complex data">
+    <thead>
+     <tr>
+      <th><a data-link-type="dfn" href="#cue-component-class-names" id="ref-for-cue-component-class-names-3">class names</a>
+      <th><a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-color-4/#propdef-color">color</a> value
+    <tbody>
+     <tr>
+      <td><code>white</code>
+      <td><span class="css">rgba(255,255,255,1)</span>
+     <tr>
+      <td><code>lime</code>
+      <td><span class="css">rgba(0,255,0,1)</span>
+     <tr>
+      <td><code>cyan</code>
+      <td><span class="css">rgba(0,255,255,1)</span>
+     <tr>
+      <td><code>red</code>
+      <td><span class="css">rgba(255,0,0,1)</span>
+     <tr>
+      <td><code>yellow</code>
+      <td><span class="css">rgba(255,255,0,1)</span>
+     <tr>
+      <td><code>magenta</code>
+      <td><span class="css">rgba(255,0,255,1)</span>
+     <tr>
+      <td><code>blue</code>
+      <td><span class="css">rgba(0,0,255,1)</span>
+     <tr>
+      <td><code>black</code>
+      <td><span class="css">rgba(0,0,0,1)</span>
+   </table>
+   <p class="note" role="note">If your background is captioning, don’t get confused: The color for the class <code>lime</code> is what has traditionally been used in captioning under the name <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css-color-4/#valdef-color-green">green</a> (e.g.
+608/708).</p>
+   <p class="note" role="note">Do not use the classes <code>blue</code> and <code>black</code> on the default dark
+background, since they result in unreadable text. In general, please refer to WCAG for guidance on
+color contrast <a data-link-type="biblio" href="#biblio-wcag20">[WCAG20]</a> and make sure to take into account the text color, background color and
+also the video’s color.</p>
+   <h3 class="heading settled" data-level="5.2" id="default-text-background"><span class="secno">5.2. </span><span class="content">Default text background colors</span><a class="self-link" href="#default-text-background"></a></h3>
+   <p><a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-components" id="ref-for-webvtt-caption-or-subtitle-cue-components-7">WebVTT caption or subtitle cue components</a> that have one or more <a data-link-type="dfn" href="#cue-component-class-names" id="ref-for-cue-component-class-names-4">class names</a> matching those in the first cell of a row in the table below must set their <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-background/#propdef-background-color">background-color</a> property as <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/rendering.html#presentational-hints">presentational hints</a> to the value in the second cell
+of the row:</p>
+   <table class="complex data">
+    <thead>
+     <tr>
+      <th><a data-link-type="dfn" href="#cue-component-class-names" id="ref-for-cue-component-class-names-5">class names</a>
+      <th><a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-background/#propdef-background">background</a> value
+    <tbody>
+     <tr>
+      <td><code>bg_white</code>
+      <td><span class="css">rgba(255,255,255,1)</span>
+     <tr>
+      <td><code>bg_lime</code>
+      <td><span class="css">rgba(0,255,0,1)</span>
+     <tr>
+      <td><code>bg_cyan</code>
+      <td><span class="css">rgba(0,255,255,1)</span>
+     <tr>
+      <td><code>bg_red</code>
+      <td><span class="css">rgba(255,0,0,1)</span>
+     <tr>
+      <td><code>bg_yellow</code>
+      <td><span class="css">rgba(255,255,0,1)</span>
+     <tr>
+      <td><code>bg_magenta</code>
+      <td><span class="css">rgba(255,0,255,1)</span>
+     <tr>
+      <td><code>bg_blue</code>
+      <td><span class="css">rgba(0,0,255,1)</span>
+     <tr>
+      <td><code>bg_black</code>
+      <td><span class="css">rgba(0,0,0,1)</span>
+   </table>
+   <p class="note" role="note">The color for the class <code>bg_lime</code> is what has traditionally been used in
+captioning under the name <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css-color-4/#valdef-color-green">green</a> (e.g. 608/708).</p>
+   <p>For the purpose of determining the <a data-link-type="dfn" href="https://www.w3.org/TR/css-cascade-4/#cascade">cascade</a> of the color and background
+classes, the order of appearance determines the cascade of the classes.</p>
+   <div class="example" id="example-a15d9824">
+    <a class="self-link" href="#example-a15d9824"></a>
+    <p>This example shows how to use the classes.</p>
+<pre>WEBVTT
+            +
+02:00.000 --> 02:05.000
+&lt;c.yellow.bg_blue>This is yellow text on a blue background&lt;/c>
+            +
+04:00.000 --> 04:05.000
+&lt;c.yellow.bg_blue.magenta.bg_black>This is magenta text on a black background&lt;/c>
+</pre>
+   </div>
+   <p class="note" role="note">Default classes can be changed by authors, e.g. ::cue(.yellow) {color:cyan} would
+change all .yellow classed text to cyan.</p>
+   <h2 class="heading settled" data-level="6" id="parsing"><span class="secno">6. </span><span class="content">Parsing</span><a class="self-link" href="#parsing"></a></h2>
+   <p>WebVTT file parsing is the same for all types of WebVTT files, including captions, subtitles,
+chapters, or metadata. Most of the steps will be skipped for chapters or metadata files.</p>
+   <h3 class="heading settled algorithm" data-algorithm="WebVTT file parsing" data-level="6.1" id="file-parsing"><span class="secno">6.1. </span><span class="content">WebVTT file parsing</span><a class="self-link" href="#file-parsing"></a></h3>
    <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-parser">WebVTT parser</dfn>, given an input byte stream, a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#list-of-cues">text track list of cues</a> <var>output</var>, and a collection of <a data-link-type="dfn" href="https://www.w3.org/TR/cssom-1/#css-style-sheet">CSS style sheets</a> <var>stylesheets</var>, must decode the byte
 stream using the <a data-link-type="dfn" href="https://www.w3.org/TR/encoding/#utf-8-decode">UTF-8 decode</a> algorithm, and then must parse the resulting
-string according to the <a data-link-type="dfn" href="#webvtt-parser-algorithm" id="ref-for-webvtt-parser-algorithm-1">WebVTT parser algorithm</a> below. This results in <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-14">WebVTT cues</a> being added to <var>output</var>, and <a data-link-type="dfn" href="https://www.w3.org/TR/cssom-1/#css-style-sheet">CSS style sheets</a> being added to <var>stylesheets</var>. <a data-link-type="biblio" href="#biblio-rfc3629">[RFC3629]</a></p>
+string according to the <a data-link-type="dfn" href="#webvtt-parser-algorithm" id="ref-for-webvtt-parser-algorithm-1">WebVTT parser algorithm</a> below. This results in <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-18">WebVTT cues</a> being added to <var>output</var>, and <a data-link-type="dfn" href="https://www.w3.org/TR/cssom-1/#css-style-sheet">CSS style sheets</a> being added to <var>stylesheets</var>. <a data-link-type="biblio" href="#biblio-rfc3629">[RFC3629]</a></p>
    <p>A <a data-link-type="dfn" href="#webvtt-parser" id="ref-for-webvtt-parser-2">WebVTT parser</a>, specifically its conversion and parsing steps, is typically run
 asynchronously, with the input byte stream being updated incrementally as the resource is
 downloaded; this is called an <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="incremental-webvtt-parser">incremental WebVTT parser</dfn>.</p>
    <p>A <a data-link-type="dfn" href="#webvtt-parser" id="ref-for-webvtt-parser-3">WebVTT parser</a> verifies a file signature before parsing the provided byte stream. If the
 stream lacks this WebVTT file signature, then the parser aborts.</p>
    <p>The <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-parser-algorithm">WebVTT parser algorithm</dfn> is as follows:</p>
-   <ol class="algorithm">
+   <ol class="algorithm" data-algorithm="WebVTT parser algorithm">
     <li>
      <p>Let <var>input</var> be the string being parsed, after conversion to Unicode, and with the following
   transformations applied:</p>
@@ -3097,13 +3430,13 @@
  characters.</p>
     <li>
      <p>If <var>position</var> is past the end of <var>input</var>, then abort these steps. The file was successfully
- processed, but it contains no useful data and so no <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-15">WebVTT cues</a> were added
+ processed, but it contains no useful data and so no <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-19">WebVTT cues</a> were added
  to <var>output</var>.</p>
     <li>
      <p>The character indicated by <var>position</var> is a U+000A LINE FEED (LF) character. Advance <var>position</var> to the next character in <var>input</var>.</p>
     <li>
      <p>If <var>position</var> is past the end of <var>input</var>, then abort these steps. The file was successfully
- processed, but it contains no useful data and so no <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-16">WebVTT cues</a> were added
+ processed, but it contains no useful data and so no <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-20">WebVTT cues</a> were added
  to <var>output</var>.</p>
     <li>
      <p><i>Header</i>: If the character indicated by <var>position</var> is not a U+000A LINE FEED (LF)
@@ -3119,7 +3452,7 @@
       <li>
        <p><a data-link-type="dfn" href="#collect-a-webvtt-block" id="ref-for-collect-a-webvtt-block-2">Collect a WebVTT block</a>, and let <var>block</var> be the returned value.</p>
       <li>
-       <p>If <var>block</var> is a <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-17">WebVTT cue</a>, add <var>block</var> to the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#list-of-cues">text track list of cues</a> <var>output</var>.</p>
+       <p>If <var>block</var> is a <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-21">WebVTT cue</a>, add <var>block</var> to the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#list-of-cues">text track list of cues</a> <var>output</var>.</p>
       <li>
        <p>Otherwise, if <var>block</var> is a <a data-link-type="dfn" href="https://www.w3.org/TR/cssom-1/#css-style-sheet">CSS style sheet</a>, add <var>block</var> to <var>stylesheets</var>.</p>
       <li>
@@ -3187,7 +3520,7 @@
           <li>
            <p>Let <var>previous position</var> be <var>position</var>.</p>
           <li>
-           <p><i>Cue creation</i>: Let <var>cue</var> be a new <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-18">WebVTT cue</a> and initialize it as
+           <p><i>Cue creation</i>: Let <var>cue</var> be a new <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-22">WebVTT cue</a> and initialize it as
         follows:</p>
            <ol>
             <li>
@@ -3199,7 +3532,7 @@
             <li>
              <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-13">WebVTT cue writing direction</a> be <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-13">horizontal</a>.</p>
             <li>
-             <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-9">WebVTT cue snap-to-lines flag</a> be true.</p>
+             <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-8">WebVTT cue snap-to-lines flag</a> be true.</p>
             <li>
              <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-21">WebVTT cue line</a> be <a data-link-type="dfn" href="#webvtt-cue-line-automatic" id="ref-for-webvtt-cue-line-automatic-4">auto</a>.</p>
             <li>
@@ -3211,9 +3544,9 @@
             <li>
              <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-7">WebVTT cue size</a> be 100.</p>
             <li>
-             <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-13">WebVTT cue text alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-center-alignment" id="ref-for-webvtt-cue-center-alignment-5">center alignment</a>.</p>
+             <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-15">WebVTT cue text alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-center-alignment" id="ref-for-webvtt-cue-center-alignment-5">center alignment</a>.</p>
             <li>
-             <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#text-track-cue-text" id="ref-for-text-track-cue-text-2">text track cue text</a> be the empty string.</p>
+             <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-7">cue text</a> be the empty string.</p>
            </ol>
           <li>
            <p><a data-link-type="dfn" href="#collect-webvtt-cue-timings-and-settings" id="ref-for-collect-webvtt-cue-timings-and-settings-1">Collect WebVTT cue timings and settings</a> from <var>line</var> using <var>regions</var> for <var>cue</var>.
@@ -3269,7 +3602,7 @@
         whitespace</a>, then run these substeps:</p>
            <ol>
             <li>
-             <p><i>Region creation</i>: Let <var>region</var> be a new <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-8">WebVTT region</a>.</p>
+             <p><i>Region creation</i>: Let <var>region</var> be a new <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-9">WebVTT region</a>.</p>
             <li>
              <p>Let <var>region</var>’s <a data-link-type="dfn" href="#webvtt-region-identifier" id="ref-for-webvtt-region-identifier-2">identifier</a> be the empty
          string.</p>
@@ -3299,7 +3632,7 @@
        <p>If <var>seen EOF</var> is true, break out of <i>loop</i>.</p>
      </ol>
     <li>
-     <p>If <var>cue</var> is not null, let the <a data-link-type="dfn" href="#text-track-cue-text" id="ref-for-text-track-cue-text-3">text track cue text</a> of <var>cue</var> be <var>buffer</var>, and return <var>cue</var>.</p>
+     <p>If <var>cue</var> is not null, let the <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-8">cue text</a> of <var>cue</var> be <var>buffer</var>, and return <var>cue</var>.</p>
     <li>
      <p>Otherwise, if <var>stylesheet</var> is not null, then <a data-link-type="dfn" href="https://www.w3.org/TR/css-syntax-3/#parse-a-stylesheet0">Parse a stylesheet</a> from <var>buffer</var>. If it returned a list of rules, assign the list as <var>stylesheet</var>’s <a data-link-type="dfn" href="https://www.w3.org/TR/cssom-1/#concept-css-style-sheet-css-rules">CSS rules</a>; otherwise, set <var>stylesheet</var>’s <a data-link-type="dfn" href="https://www.w3.org/TR/cssom-1/#concept-css-style-sheet-css-rules">CSS
  rules</a> to an empty list. <a data-link-type="biblio" href="#biblio-cssom">[CSSOM]</a> <a data-link-type="biblio" href="#biblio-css-syntax-3">[CSS-SYNTAX-3]</a> Finally, return <var>stylesheet</var>.</p>
@@ -3309,14 +3642,13 @@
     <li>
      <p>Otherwise, return null.</p>
    </ol>
-   <h3 class="heading settled algorithm" data-algorithm="WebVTT region settings parsing" data-level="5.2" id="region-settings-parsing"><span class="secno">5.2. </span><span class="content">WebVTT region settings parsing</span><a class="self-link" href="#region-settings-parsing"></a></h3>
-   <p>When the <a data-link-type="dfn" href="#webvtt-parser" id="ref-for-webvtt-parser-5">WebVTT parser</a> requires that the user agent <dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="collect WebVTT region settings" data-noexport="" id="collect-webvtt-region-settings">collect WebVTT region
-settings</dfn> from a string <var>input</var> for a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text track</a>, the user agent must run the following
-algorithm.</p>
+   <h3 class="heading settled algorithm" data-algorithm="WebVTT region settings parsing" data-level="6.2" id="region-settings-parsing"><span class="secno">6.2. </span><span class="content">WebVTT region settings parsing</span><a class="self-link" href="#region-settings-parsing"></a></h3>
+   <p>When the <a data-link-type="dfn" href="#webvtt-parser-algorithm" id="ref-for-webvtt-parser-algorithm-2">WebVTT parser algorithm</a> says to <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="collect-webvtt-region-settings">collect WebVTT region settings</dfn> from a
+string <var>input</var> for a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text track</a>, the user agent must run the following algorithm.</p>
+   <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-region-object">WebVTT region object</dfn> is a conceptual construct to represent a <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-10">WebVTT region</a> that is used as a root node for <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-1">lists of WebVTT node
-   <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-region-object">WebVTT region object</dfn> is a conceptual construct to represent a <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-9">WebVTT region</a> that is used as a root node for <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-1">lists of WebVTT node
 objects</a>. This algorithm returns a list of <a data-link-type="dfn" href="#webvtt-region-object" id="ref-for-webvtt-region-object-3">WebVTT Region
 Objects</a>.</p>
-   <ol class="algorithm">
+   <ol class="algorithm" data-algorithm="WebVTT region objects">
     <li>
      <p>Let <var>settings</var> be the result of <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#split-a-string-on-spaces">splitting <var>input</var> on
  spaces</a>.</p>
@@ -3406,7 +3738,7 @@
    <p>The rules to <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="parse-a-percentage-string">parse a percentage string</dfn> are as follows. This will return either a
 number in the range 0..100, or nothing. If at any point the algorithm says that it "fails", this
 means that it is aborted at that point and returns nothing.</p>
-   <ol class="algorithm">
+   <ol class="algorithm" data-algorithm="parse a percentage string">
     <li>
      <p>Let <var>input</var> be the string being parsed.</p>
     <li>
@@ -3421,10 +3753,10 @@
     <li>
      <p>Return <var>percentage</var>.</p>
    </ol>
-   <h3 class="heading settled algorithm" data-algorithm="WebVTT cue timings and settings parsing" data-level="5.3" id="cue-timings-and-settings-parsing"><span class="secno">5.3. </span><span class="content">WebVTT cue timings and settings parsing</span><a class="self-link" href="#cue-timings-and-settings-parsing"></a></h3>
-   <p>When the algorithm above requires that the user agent <dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="collect WebVTT cue timings and settings" data-noexport="" id="collect-webvtt-cue-timings-and-settings">collect WebVTT cue timings and
-settings</dfn> from a string <var>input</var> using a <a data-link-type="dfn" href="#text-track-list-of-regions" id="ref-for-text-track-list-of-regions-2">text track list of regions</a> <var>regions</var> for a <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-19">WebVTT cue</a> <var>cue</var>, the user agent must run the following algorithm.</p>
-   <ol class="algorithm">
+   <h3 class="heading settled algorithm" data-algorithm="WebVTT cue timings and settings parsing" data-level="6.3" id="cue-timings-and-settings-parsing"><span class="secno">6.3. </span><span class="content">WebVTT cue timings and settings parsing</span><a class="self-link" href="#cue-timings-and-settings-parsing"></a></h3>
+   <p>When the algorithm above says to <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="collect-webvtt-cue-timings-and-settings">collect WebVTT cue timings and settings</dfn> from a string <var>input</var> using a <a data-link-type="dfn" href="#text-track-list-of-regions" id="ref-for-text-track-list-of-regions-2">text track list of regions</a> <var>regions</var> for a <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-23">WebVTT cue</a> <var>cue</var>, the user
+agent must run the following algorithm.</p>
+   <ol class="algorithm" data-algorithm="collect WebVTT cue timings and settings">
     <li>
      <p>Let <var>input</var> be the string being parsed.</p>
     <li>
@@ -3460,7 +3792,7 @@
    </ol>
    <p>When the user agent is to <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="parse-the-webvtt-cue-settings">parse the WebVTT cue settings</dfn> from a string <var>input</var> using a <a data-link-type="dfn" href="#text-track-list-of-regions" id="ref-for-text-track-list-of-regions-3">text track list of regions</a> <var>regions</var> for a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#cue">text track cue</a> <var>cue</var>, the user agent must
 run the following steps:</p>
-   <ol class="algorithm">
+   <ol class="algorithm" data-algorithm="parse the WebVTT cue settings">
     <li>
      <p>Let <var>settings</var> be the result of <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#split-a-string-on-spaces">splitting <var>input</var> on
  spaces</a>.</p>
@@ -3484,7 +3816,7 @@
         <dd>
          <ol>
           <li>
-           <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-3">WebVTT cue region</a> be the last <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-10">WebVTT region</a> in <var>regions</var> whose <a data-link-type="dfn" href="#webvtt-region-identifier" id="ref-for-webvtt-region-identifier-4">WebVTT region identifier</a> is <var>value</var>, if any, or null otherwise.</p>
+           <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-3">WebVTT cue region</a> be the last <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-11">WebVTT region</a> in <var>regions</var> whose <a data-link-type="dfn" href="#webvtt-region-identifier" id="ref-for-webvtt-region-identifier-4">WebVTT region identifier</a> is <var>value</var>, if any, or null otherwise.</p>
          </ol>
         <dt>If <var>name</var> is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#case-sensitive">case-sensitive</a> match for "<code>vertical</code>"
         <dd>
@@ -3494,6 +3826,9 @@
           <li>
            <p>Otherwise, if <var>value</var> is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#case-sensitive">case-sensitive</a> match for the string
        "<code>lr</code>", then let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-15">WebVTT cue writing direction</a> be <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-4">vertical growing right</a>.</p>
+          <li>
+           <p>If <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-16">WebVTT cue writing direction</a> is not <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-14">horizontal</a>, let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-4">WebVTT cue region</a> be null (there are no
+       vertical regions).</p>
          </ol>
         <dt>If <var>name</var> is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#case-sensitive">case-sensitive</a> match for "<code>line</code>"
         <dd>
@@ -3555,7 +3890,11 @@
           <li>
            <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-22">WebVTT cue line</a> be <var>number</var>.</p>
           <li>
-           <p>If the last character in <var>linepos</var> is a U+0025 PERCENT SIGN character (%), then let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-10">WebVTT cue snap-to-lines flag</a> be false. Otherwise, let it be true.</p>
+           <p>If the last character in <var>linepos</var> is a U+0025 PERCENT SIGN character (%), then let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-9">WebVTT cue snap-to-lines flag</a> be false. Otherwise, let it be true.</p>
+          <li>
+           <p>If <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-23">WebVTT cue line</a> is not <a data-link-type="dfn" href="#webvtt-cue-line-automatic" id="ref-for-webvtt-cue-line-automatic-5">auto</a>,
+       let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-5">WebVTT cue region</a> be null (the cue has been explicitly positioned with a
+       line offset and thus drops out of the region).</p>
          </ol>
         <dt>If <var>name</var> is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#case-sensitive">case-sensitive</a> match for "<code>position</code>"
         <dd>
@@ -3572,13 +3911,13 @@
        returned <var>percentage</var>, otherwise jump to the step labeled <i>next setting</i> (<a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-21">position</a>’s value remains the special value <a data-link-type="dfn" href="#webvtt-cue-automatic-position" id="ref-for-webvtt-cue-automatic-position-7">auto</a>).</p>
           <li>
            <p>If <var>colalign</var> is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#case-sensitive">case-sensitive</a> match for the string
-       "<code>line-left</code>", then let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-position-alignment" id="ref-for-webvtt-cue-position-alignment-8">WebVTT cue position alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-position-line-left-alignment" id="ref-for-webvtt-cue-position-line-left-alignment-4">line-left alignment</a>.</p>
+       "<code>line-left</code>", then let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-position-alignment" id="ref-for-webvtt-cue-position-alignment-8">WebVTT cue position alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-position-line-left-alignment" id="ref-for-webvtt-cue-position-line-left-alignment-6">line-left alignment</a>.</p>
           <li>
            <p>Otherwise, if <var>colalign</var> is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#case-sensitive">case-sensitive</a> match for the string
        "<code>center</code>", then let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-position-alignment" id="ref-for-webvtt-cue-position-alignment-9">WebVTT cue position alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-position-center-alignment" id="ref-for-webvtt-cue-position-center-alignment-2">center alignment</a>.</p>
           <li>
            <p>Otherwise, if <var>colalign</var> is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#case-sensitive">case-sensitive</a> match for the string
-       "<code>line-right</code>", then let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-position-alignment" id="ref-for-webvtt-cue-position-alignment-10">WebVTT cue position alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-3">line-right alignment</a>.</p>
+       "<code>line-right</code>", then let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-position-alignment" id="ref-for-webvtt-cue-position-alignment-10">WebVTT cue position alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-5">line-right alignment</a>.</p>
           <li>
            <p>Otherwise, if <var>colalign</var> is not null, then jump to the step labeled <i>next
        setting</i>.</p>
@@ -3593,29 +3932,32 @@
        returned <var>percentage</var>, otherwise jump to the step labeled <i>next setting</i>.</p>
           <li>
            <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-8">WebVTT cue size</a> be <var>number</var>.</p>
+          <li>
+           <p>If <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-9">WebVTT cue size</a> is not 100, let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-6">WebVTT cue region</a> be
+       null (the cue has been explicitly sized and thus drops out of the region).</p>
          </ol>
         <dt>If <var>name</var> is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#case-sensitive">case-sensitive</a> match for "<code>align</code>"
         <dd>
          <ol>
           <li>
            <p>If <var>value</var> is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#case-sensitive">case-sensitive</a> match for the string "<code>start</code>", then
-       let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-14">WebVTT cue text alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-start-alignment" id="ref-for-webvtt-cue-start-alignment-6">start
+       let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-16">WebVTT cue text alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-start-alignment" id="ref-for-webvtt-cue-start-alignment-7">start
        alignment</a>.</p>
           <li>
            <p>If <var>value</var> is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#case-sensitive">case-sensitive</a> match for the string "<code>center</code>", then
-       let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-15">WebVTT cue text alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-center-alignment" id="ref-for-webvtt-cue-center-alignment-6">center
+       let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-17">WebVTT cue text alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-center-alignment" id="ref-for-webvtt-cue-center-alignment-6">center
        alignment</a>.</p>
           <li>
            <p>If <var>value</var> is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#case-sensitive">case-sensitive</a> match for the string "<code>end</code>", then
-       let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-16">WebVTT cue text alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-end-alignment" id="ref-for-webvtt-cue-end-alignment-5">end
+       let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-18">WebVTT cue text alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-end-alignment" id="ref-for-webvtt-cue-end-alignment-6">end
        alignment</a>.</p>
           <li>
            <p>If <var>value</var> is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#case-sensitive">case-sensitive</a> match for the string "<code>left</code>", then
-       let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-17">WebVTT cue text alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-left-alignment" id="ref-for-webvtt-cue-left-alignment-5">left
+       let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-19">WebVTT cue text alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-left-alignment" id="ref-for-webvtt-cue-left-alignment-5">left
        alignment</a>.</p>
           <li>
            <p>If <var>value</var> is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#case-sensitive">case-sensitive</a> match for the string "<code>right</code>", then
-       let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-18">WebVTT cue text alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-right-alignment" id="ref-for-webvtt-cue-right-alignment-5">right
+       let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-20">WebVTT cue text alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-right-alignment" id="ref-for-webvtt-cue-right-alignment-5">right
        alignment</a>.</p>
          </ol>
        </dl>
@@ -3625,7 +3967,7 @@
    </ol>
    <p>When this specification says that a user agent is to <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="collect-a-webvtt-timestamp">collect a WebVTT timestamp</dfn>, the
 user agent must run the following steps:</p>
-   <ol class="algorithm">
+   <ol class="algorithm" data-algorithm="collect a WebVTT timestamp">
     <li>
      <p>Let <var>input</var> and <var>position</var> be the same variables as those of the same name in the algorithm
  that invoked these steps.</p>
@@ -3695,18 +4037,18 @@
     <li>
      <p>Return <var>result</var>.</p>
    </ol>
-   <h3 class="heading settled algorithm" data-algorithm="WebVTT cue text parsing rules" data-level="5.4" id="cue-text-parsing-rules"><span class="secno">5.4. </span><span class="content">WebVTT cue text parsing rules</span><a class="self-link" href="#cue-text-parsing-rules"></a></h3>
-   <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-node-object">WebVTT Node Object</dfn> is a conceptual construct used to represent components of <a data-link-type="dfn" href="#webvtt-cue-text" id="ref-for-webvtt-cue-text-6">WebVTT cue text</a> so that its processing can be described without reference to the underlying
-syntax.</p>
+   <h3 class="heading settled algorithm" data-algorithm="WebVTT cue text parsing rules" data-level="6.4" id="cue-text-parsing-rules"><span class="secno">6.4. </span><span class="content">WebVTT cue text parsing rules</span><a class="self-link" href="#cue-text-parsing-rules"></a></h3>
+   <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-node-object">WebVTT Node Object</dfn> is a conceptual construct used to represent components of <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-9">cue
+text</a> so that its processing can be described without reference to the underlying syntax.</p>
    <p>There are two broad classes of <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-1">WebVTT Node Objects</a>: <a data-link-type="dfn" href="#webvtt-internal-node-object" id="ref-for-webvtt-internal-node-object-1">WebVTT Internal Node Objects</a> and <a data-link-type="dfn" href="#webvtt-leaf-node-object" id="ref-for-webvtt-leaf-node-object-1">WebVTT
 Leaf Node Objects</a>.</p>
    <p><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT Internal Node Object" data-noexport="" id="webvtt-internal-node-object">WebVTT Internal Node Objects</dfn> are those that can
 contain further <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-2">WebVTT Node Objects</a>. They are conceptually similar to
 elements in HTML or the DOM. <a data-link-type="dfn" href="#webvtt-internal-node-object" id="ref-for-webvtt-internal-node-object-2">WebVTT Internal Node Objects</a> have an ordered list of child <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-3">WebVTT Node Objects</a>. The <a data-link-type="dfn" href="#webvtt-internal-node-object" id="ref-for-webvtt-internal-node-object-3">WebVTT
 Internal Node Object</a> is said to be the <i>parent</i> of the children. Cycles do not occur; the
-parent-child relationships so constructed form a tree structure. <a data-link-type="dfn" href="#webvtt-internal-node-object" id="ref-for-webvtt-internal-node-object-4">WebVTT Internal Node Objects</a> also have an ordered list of class names, known as their <dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT Node Object’s applicable classes" data-noexport="" id="webvtt-node-objects-applicable-classes">applicable classes</dfn>, and a language, known as
-their <dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT Node Object’s applicable language" data-noexport="" id="webvtt-node-objects-applicable-language">applicable language</dfn>, which is to be
-interpreted as a BCP 47 language tag. <a data-link-type="biblio" href="#biblio-bcp47">[BCP47]</a></p>
+parent-child relationships so constructed form a tree structure. <a data-link-type="dfn" href="#webvtt-internal-node-object" id="ref-for-webvtt-internal-node-object-4">WebVTT Internal Node Objects</a> also have an ordered list of <a data-link-type="dfn" href="#cue-component-class-names" id="ref-for-cue-component-class-names-6">class names</a>, known as their <dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT Node Object’s applicable classes" data-noexport="" id="webvtt-node-objects-applicable-classes">applicable
+classes</dfn>, and a language, known as their <dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT Node Object’s applicable
+language" data-noexport="" id="webvtt-node-objects-applicable-language">applicable language</dfn>, which is to be interpreted as a BCP 47 language tag. <a data-link-type="biblio" href="#biblio-bcp47">[BCP47]</a></p>
    <p class="note" role="note">User agents will add a language tag as the <a data-link-type="dfn" href="#webvtt-node-objects-applicable-language" id="ref-for-webvtt-node-objects-applicable-language-1">applicable language</a> even if it is not a valid or not even well-formed language tag. <a data-link-type="biblio" href="#biblio-bcp47">[BCP47]</a></p>
    <p>There are several concrete classes of <a data-link-type="dfn" href="#webvtt-internal-node-object" id="ref-for-webvtt-internal-node-object-5">WebVTT Internal Node
 Objects</a>:</p>
@@ -3717,37 +4059,39 @@
   Objects</a>.</p>
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT Class Object" data-noexport="" id="webvtt-class-object">WebVTT Class Objects</dfn>
     <dd>
-     <p>These represent spans of text (a <a data-link-type="dfn" href="#webvtt-cue-class-span" id="ref-for-webvtt-cue-class-span-2">WebVTT cue class span</a>) in <a data-link-type="dfn" href="#webvtt-cue-text" id="ref-for-webvtt-cue-text-7">WebVTT cue text</a>, and
-  are used to annotate parts of the cue with <a data-link-type="dfn" href="#webvtt-node-objects-applicable-classes" id="ref-for-webvtt-node-objects-applicable-classes-1">applicable classes</a> without implying further meaning (such as italics or bold).</p>
+     <p>These represent spans of text (a <a data-link-type="dfn" href="#webvtt-cue-class-span" id="ref-for-webvtt-cue-class-span-2">WebVTT cue class span</a>) in <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-10">cue text</a>, and are used
+  to annotate parts of the cue with <a data-link-type="dfn" href="#webvtt-node-objects-applicable-classes" id="ref-for-webvtt-node-objects-applicable-classes-1">applicable
+  classes</a> without implying further meaning (such as italics or bold).</p>
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT Italic Object" data-noexport="" id="webvtt-italic-object">WebVTT Italic Objects</dfn>
     <dd>
-     <p>These represent spans of italic text (a <a data-link-type="dfn" href="#webvtt-cue-italics-span" id="ref-for-webvtt-cue-italics-span-2">WebVTT cue italics span</a>) in <a data-link-type="dfn" href="#webvtt-cue-text" id="ref-for-webvtt-cue-text-8">WebVTT cue
-  text</a>.</p>
+     <p>These represent spans of italic text (a <a data-link-type="dfn" href="#webvtt-cue-italics-span" id="ref-for-webvtt-cue-italics-span-2">WebVTT cue italics span</a>) in <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-text" id="ref-for-webvtt-caption-or-subtitle-cue-text-5">WebVTT caption or
+  subtitle cue text</a>.</p>
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT Bold Object" data-noexport="" id="webvtt-bold-object">WebVTT Bold Objects</dfn>
     <dd>
-     <p>These represent spans of bold text (a <a data-link-type="dfn" href="#webvtt-cue-bold-span" id="ref-for-webvtt-cue-bold-span-2">WebVTT cue bold span</a>) in <a data-link-type="dfn" href="#webvtt-cue-text" id="ref-for-webvtt-cue-text-9">WebVTT cue
-  text</a>.</p>
+     <p>These represent spans of bold text (a <a data-link-type="dfn" href="#webvtt-cue-bold-span" id="ref-for-webvtt-cue-bold-span-2">WebVTT cue bold span</a>) in <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-text" id="ref-for-webvtt-caption-or-subtitle-cue-text-6">WebVTT caption or
+  subtitle cue text</a>.</p>
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT Underline Object" data-noexport="" id="webvtt-underline-object">WebVTT Underline Objects</dfn>
     <dd>
-     <p>These represent spans of underline text (a <a data-link-type="dfn" href="#webvtt-cue-underline-span" id="ref-for-webvtt-cue-underline-span-2">WebVTT cue underline span</a>) in <a data-link-type="dfn" href="#webvtt-cue-text" id="ref-for-webvtt-cue-text-10">WebVTT cue
-  text</a>.</p>
+     <p>These represent spans of underline text (a <a data-link-type="dfn" href="#webvtt-cue-underline-span" id="ref-for-webvtt-cue-underline-span-2">WebVTT cue underline span</a>) in <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-text" id="ref-for-webvtt-caption-or-subtitle-cue-text-7">WebVTT
+  caption or subtitle cue text</a>.</p>
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT Ruby Object" data-noexport="" id="webvtt-ruby-object">WebVTT Ruby Objects</dfn>
     <dd>
-     <p>These represent spans of ruby (a <a data-link-type="dfn" href="#webvtt-cue-ruby-span" id="ref-for-webvtt-cue-ruby-span-3">WebVTT cue ruby span</a>) in <a data-link-type="dfn" href="#webvtt-cue-text" id="ref-for-webvtt-cue-text-11">WebVTT cue text</a>.</p>
+     <p>These represent spans of ruby (a <a data-link-type="dfn" href="#webvtt-cue-ruby-span" id="ref-for-webvtt-cue-ruby-span-3">WebVTT cue ruby span</a>) in <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-text" id="ref-for-webvtt-caption-or-subtitle-cue-text-8">WebVTT caption or subtitle
+  cue text</a>.</p>
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT Ruby Text Object" data-noexport="" id="webvtt-ruby-text-object">WebVTT Ruby Text Objects</dfn>
     <dd>
-     <p>These represent spans of ruby text (a <a data-link-type="dfn" href="#webvtt-cue-ruby-text-span" id="ref-for-webvtt-cue-ruby-text-span-1">WebVTT cue ruby text span</a>) in <a data-link-type="dfn" href="#webvtt-cue-text" id="ref-for-webvtt-cue-text-12">WebVTT cue
-  text</a>.</p>
+     <p>These represent spans of ruby text (a <a data-link-type="dfn" href="#webvtt-cue-ruby-text-span" id="ref-for-webvtt-cue-ruby-text-span-1">WebVTT cue ruby text span</a>) in <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-text" id="ref-for-webvtt-caption-or-subtitle-cue-text-9">WebVTT caption or
+  subtitle cue text</a>.</p>
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT Voice Object" data-noexport="" id="webvtt-voice-object">WebVTT Voice Objects</dfn>
     <dd>
      <p>These represent spans of text associated with a specific voice (a <a data-link-type="dfn" href="#webvtt-cue-voice-span" id="ref-for-webvtt-cue-voice-span-3">WebVTT cue voice span</a>)
-  in <a data-link-type="dfn" href="#webvtt-cue-text" id="ref-for-webvtt-cue-text-13">WebVTT cue text</a>. A <a data-link-type="dfn" href="#webvtt-voice-object" id="ref-for-webvtt-voice-object-1">WebVTT Voice Object</a> has a value, which is the name of the
-  voice.</p>
+  in <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-text" id="ref-for-webvtt-caption-or-subtitle-cue-text-10">WebVTT caption or subtitle cue text</a>. A <a data-link-type="dfn" href="#webvtt-voice-object" id="ref-for-webvtt-voice-object-1">WebVTT Voice Object</a> has a value, which is
+  the name of the voice.</p>
     <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT Language Object" data-noexport="" id="webvtt-language-object">WebVTT Language Objects</dfn>
     <dd>
-     <p>These represent spans of text (a <a data-link-type="dfn" href="#webvtt-cue-language-span" id="ref-for-webvtt-cue-language-span-2">WebVTT cue language span</a>) in <a data-link-type="dfn" href="#webvtt-cue-text" id="ref-for-webvtt-cue-text-14">WebVTT cue text</a>,
-  and are used to annotate parts of the cue where the <a data-link-type="dfn" href="#webvtt-node-objects-applicable-language" id="ref-for-webvtt-node-objects-applicable-language-2">applicable language</a> might be different than the surrounding text’s, without implying
-  further meaning (such as italics or bold).</p>
+     <p>These represent spans of text (a <a data-link-type="dfn" href="#webvtt-cue-language-span" id="ref-for-webvtt-cue-language-span-2">WebVTT cue language span</a>) in <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-text" id="ref-for-webvtt-caption-or-subtitle-cue-text-11">WebVTT caption or
+  subtitle cue text</a>, and are used to annotate parts of the cue where the <a data-link-type="dfn" href="#webvtt-node-objects-applicable-language" id="ref-for-webvtt-node-objects-applicable-language-2">applicable language</a> might be different than the surrounding
+  text’s, without implying further meaning (such as italics or bold).</p>
    </dl>
    <p><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="WebVTT Leaf Node Object" data-noexport="" id="webvtt-leaf-node-object">WebVTT Leaf Node Objects</dfn> are those that contain data,
 such as text, and cannot contain child <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-5">WebVTT Node Objects</a>.</p>
@@ -3764,8 +4108,9 @@
   second, which is the time represented by the timestamp.</p>
    </dl>
    <p>The <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-cue-text-parsing-rules">WebVTT cue text parsing rules</dfn> consist of the following algorithm. The input is a
-string <var>input</var> supposedly containing <a data-link-type="dfn" href="#webvtt-cue-text" id="ref-for-webvtt-cue-text-15">WebVTT cue text</a>, and optionally a fallback language <var>language</var>. This algorithm returns a <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-2">list of WebVTT Node Objects</a>.</p>
-   <ol class="algorithm">
+string <var>input</var> supposedly containing <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue-text" id="ref-for-webvtt-caption-or-subtitle-cue-text-12">WebVTT caption or subtitle cue text</a>, and optionally a
+fallback language <var>language</var>. This algorithm returns a <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-2">list of WebVTT Node Objects</a>.</p>
+   <ol class="algorithm" data-algorithm="WebVTT cue text parsing">
     <li>
      <p>Let <var>input</var> be the string being parsed.</p>
     <li>
@@ -3896,7 +4241,7 @@
 string (whose value is a sequence of characters), a start tag (with a tag name, a list of classes,
 and optionally an annotation), an end tag (with a tag name), or a timestamp tag (with a tag
 value).</p>
-   <ol class="algorithm">
+   <ol class="algorithm" data-algorithm="WebVTT cue text tokenizer">
     <li>
      <p>Let <var>input</var> and <var>position</var> be the same variables as those of the same name in the algorithm
  that invoked these steps.</p>
@@ -4108,8 +4453,8 @@
    <p>When the HTML specification says to consume a character, in this context, it means to advance <var>position</var> to the next character in <var>input</var>. When it says to unconsume a character, it means to move <var>position</var> back to the previous character in <var>input</var>. "EOF" is equivalent to the end-of-file marker
 in this specification. Finally, this context is <em>not</em> "as part of an attribute" (when it
 comes to handling a missing semicolon).</p>
-   <h3 class="heading settled" data-level="5.5" id="dom-construction-rules"><span class="secno">5.5. </span><span class="content"><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-cue-text-dom-construction-rules">WebVTT cue text DOM construction rules</dfn></span><a class="self-link" href="#dom-construction-rules"></a></h3>
-   <p class="note" role="note">For the purpose of retrieving a <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-20">WebVTT cue</a>’s content via the <code class="idl"><a data-link-type="idl" href="#dom-vttcue-getcueashtml" id="ref-for-dom-vttcue-getcueashtml-1">getCueAsHTML()</a></code> method of the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-1">VTTCue</a></code> interface, it needs to be parsed to a <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/dom/#documentfragment">DocumentFragment</a></code>. This section describes how.</p>
+   <h3 class="heading settled" data-level="6.5" id="dom-construction-rules"><span class="secno">6.5. </span><span class="content"><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-cue-text-dom-construction-rules">WebVTT cue text DOM construction rules</dfn></span><a class="self-link" href="#dom-construction-rules"></a></h3>
+   <p class="note" role="note">For the purpose of retrieving a <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-24">WebVTT cue</a>’s content via the <code class="idl"><a data-link-type="idl" href="#dom-vttcue-getcueashtml" id="ref-for-dom-vttcue-getcueashtml-1">getCueAsHTML()</a></code> method of the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-1">VTTCue</a></code> interface, it needs to be parsed to a <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/dom/#documentfragment">DocumentFragment</a></code>. This section describes how.</p>
    <p>To convert a <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-4">list of WebVTT Node Objects</a> to a DOM tree for <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/dom/#document">Document</a></code> <var>owner</var>, user
 agents must create a tree of DOM nodes that is isomorphous to the tree of <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-6">WebVTT Node Objects</a>, with the following mapping of <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-7">WebVTT
 Node Objects</a> to DOM nodes:</p>
@@ -4171,25 +4516,27 @@
    <p>All characteristics of the DOM nodes that are not described above or dependent on characteristics
 defined above must be left at their initial values.</p>
    <h3 class="heading settled algorithm" data-algorithm="WebVTT rules for extracting the chapter
-title" data-level="5.6" id="rules-for-extracting-the-chapter-title"><span class="secno">5.6. </span><span class="content">WebVTT rules for extracting the chapter
+title" data-level="6.6" id="rules-for-extracting-the-chapter-title"><span class="secno">6.6. </span><span class="content">WebVTT rules for extracting the chapter
 title</span><a class="self-link" href="#rules-for-extracting-the-chapter-title"></a></h3>
-   <p>The <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-rules-for-extracting-the-chapter-title">WebVTT rules for extracting the chapter title</dfn> for a <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-21">WebVTT cue</a> <var>cue</var> are as
+   <p>The <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-rules-for-extracting-the-chapter-title">WebVTT rules for extracting the chapter title</dfn> for a <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-25">WebVTT cue</a> <var>cue</var> are as
 follows:</p>
-   <ol class="algorithm">
+   <ol class="algorithm" data-algorithm="WebVTT rules for extracting the chapter title">
     <li>
      <p>Let <var>nodes</var> be the <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-6">list of WebVTT Node Objects</a> obtained by applying the <a data-link-type="dfn" href="#webvtt-cue-text-parsing-rules" id="ref-for-webvtt-cue-text-parsing-rules-1">WebVTT cue
- text parsing rules</a> to the <var>cue</var>’s <a data-link-type="dfn" href="#text-track-cue-text" id="ref-for-text-track-cue-text-4">text track cue text</a>.</p>
+ text parsing rules</a> to the <var>cue</var>’s <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-11">cue text</a>.</p>
     <li>
      <p>Return the concatenation of the values of each <a data-link-type="dfn" href="#webvtt-text-object" id="ref-for-webvtt-text-object-6">WebVTT Text Object</a> in <var>nodes</var>, in a
  pre-order, depth-first traversal, excluding <a data-link-type="dfn" href="#webvtt-ruby-text-object" id="ref-for-webvtt-ruby-text-object-5">WebVTT Ruby Text
  Objects</a> and their descendants.</p>
    </ol>
-   <h2 class="heading settled" data-level="6" id="rendering"><span class="secno">6. </span><span class="content">Rendering</span><a class="self-link" href="#rendering"></a></h2>
-   <p class="note" role="note">This section describes in some detail how to visually render WebVTT cues in a user
-agent. The processing model is quite tightly linked to media elements in HTML. When supporting
-WebVTT in media players that don’t support CSS, equivalent visual rendering will need to be
-implemented.</p>
-   <h3 class="heading settled algorithm" data-algorithm="Processing model" data-level="6.1" id="processing-model"><span class="secno">6.1. </span><span class="content">Processing model</span><a class="self-link" href="#processing-model"></a></h3>
+   <h2 class="heading settled" data-level="7" id="rendering"><span class="secno">7. </span><span class="content">Rendering</span><a class="self-link" href="#rendering"></a></h2>
+   <p class="note" role="note">This section describes in some detail how to visually render <a data-link-type="dfn" href="#webvtt-caption-or-subtitle-cue" id="ref-for-webvtt-caption-or-subtitle-cue-2">WebVTT caption or
+subtitle cues</a> in a user agent. The processing model is quite tightly linked to media elements in
+HTML, where CSS is available. <a data-link-type="dfn" href="#user-agents-that-do-not-support-css" id="ref-for-user-agents-that-do-not-support-css-1">User agents that do not support CSS</a> are expected to render
+plain text only, without styling and positioning features. <a data-link-type="dfn" href="#user-agents-that-do-not-support-a-full-html-css-engine" id="ref-for-user-agents-that-do-not-support-a-full-html-css-engine-2">User agents that do not support a full
+HTML CSS engine</a> are expected to render an equivalent visual representation to what a user agent
+with a full CSS engine would render.</p>
+   <h3 class="heading settled algorithm" data-algorithm="Processing model" data-level="7.1" id="processing-model"><span class="secno">7.1. </span><span class="content">Processing model</span><a class="self-link" href="#processing-model"></a></h3>
    <p>The <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="rules-for-updating-the-display-of-webvtt-text-tracks">rules for updating the display of WebVTT text tracks</dfn> render the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text tracks</a> of a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media element</a> (specifically, a <a data-link-type="element" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#the-video-element">video</a> element), or of another playback
 mechanism, by applying the steps below. All the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text tracks</a> that use these
 rules for a given <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media element</a>, or other playback mechanism, are rendered together, to avoid
@@ -4201,7 +4548,7 @@
    <p>The output of the steps below is a set of CSS boxes that covers the rendering area of the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media element</a> or other playback mechanism, which user agents are expected to render in a
 manner suiting the user.</p>
    <p>The rules are as follows:</p>
-   <ol class="algorithm">
+   <ol class="algorithm" data-algorithm="rules for updating the display of WebVTT text tracks">
     <li>
      <p>If the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media element</a> is an <a data-link-type="element" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#the-audio-element">audio</a> element, or is another playback
  mechanism with no rendering area, abort these steps.</p>
@@ -4225,12 +4572,12 @@
      <p>For each track <var>track</var> in <var>tracks</var>, append to <var>cues</var> all the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#cue">cues</a> from <var>track</var>’s <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#list-of-cues">list of cues</a> that have their <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-cue-active-flag">text track cue
  active flag</a> set.</p>
     <li>
-     <p>Let <var>regions</var> be an empty list of <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-11">WebVTT regions</a>.</p>
+     <p>Let <var>regions</var> be an empty list of <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-12">WebVTT regions</a>.</p>
     <li>
-     <p>For each track <var>track</var> in <var>tracks</var>, append to <var>regions</var> all the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-12">regions</a> with an identifier from <var>track</var>’s <a data-link-type="dfn" href="#text-track-list-of-regions" id="ref-for-text-track-list-of-regions-4">list of
+     <p>For each track <var>track</var> in <var>tracks</var>, append to <var>regions</var> all the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-13">regions</a> with an identifier from <var>track</var>’s <a data-link-type="dfn" href="#text-track-list-of-regions" id="ref-for-text-track-list-of-regions-4">list of
  regions</a>.</p>
     <li>
-     <p>If <var>reset</var> is false, then, for each <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-13">WebVTT region</a> <var>region</var> in <var>regions</var> let <var>regionNode</var> be a <a data-link-type="dfn" href="#webvtt-region-object" id="ref-for-webvtt-region-object-5">WebVTT region object</a>.</p>
+     <p>If <var>reset</var> is false, then, for each <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-14">WebVTT region</a> <var>region</var> in <var>regions</var> let <var>regionNode</var> be a <a data-link-type="dfn" href="#webvtt-region-object" id="ref-for-webvtt-region-object-5">WebVTT region object</a>.</p>
     <li>
      <p>Apply the following steps for each <var>regionNode</var>:</p>
      <ol>
@@ -4240,7 +4587,8 @@
         <li>
          <p>Let <var>regionWidth</var> be the <a data-link-type="dfn" href="#webvtt-region-width" id="ref-for-webvtt-region-width-3">WebVTT region width</a>. Let <var>width</var> be <span class="css"><var>regionWidth</var> vw</span> (<a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-values-4/#vw">vw</a> is a CSS unit). <a data-link-type="biblio" href="#biblio-css-values">[CSS-VALUES]</a></p>
         <li>
-         <p>Let <var>lineHeight</var> be <span class="css">5.33vh</span> (<a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-values-4/#vh">vh</a> is a CSS unit) <a data-link-type="biblio" href="#biblio-css-values">[CSS-VALUES]</a> and <var>regionHeight</var> be the <a data-link-type="dfn" href="#webvtt-region-lines" id="ref-for-webvtt-region-lines-3">WebVTT region lines</a>. Let <var>lines</var> be <var>lineHeight</var> multiplied by <var>regionHeight</var>.</p>
+         <p>Let <var>lineHeight</var> be <span class="css">6vh</span> (<a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-values-4/#vh">vh</a> is a CSS unit) <a data-link-type="biblio" href="#biblio-css-values">[CSS-VALUES]</a> and <var>regionHeight</var> be
+     the <a data-link-type="dfn" href="#webvtt-region-lines" id="ref-for-webvtt-region-lines-3">WebVTT region lines</a>. Let <var>lines</var> be <var>lineHeight</var> multiplied by <var>regionHeight</var>.</p>
         <li>
          <p>Let <var>viewportAnchorX</var> be the x dimension of the <a data-link-type="dfn" href="#webvtt-region-anchor" id="ref-for-webvtt-region-anchor-3">WebVTT region anchor</a> and <var>regionAnchorX</var> be the x dimension of the <a data-link-type="dfn" href="#webvtt-region-anchor" id="ref-for-webvtt-region-anchor-4">WebVTT region anchor</a>. Let <var>leftOffset</var> be <var>regionAnchorX</var> multiplied by <var>width</var> divided by 100.0. Let <var>left</var> be <var>leftOffset</var> subtracted
      from <span class="css"><var>viewportAnchorX</var> vw</span>.</p>
@@ -4260,29 +4608,29 @@
      section uses some of the variables whose values were calculated earlier in this
      algorithm.)</p>
         <li>
-         <p>The viewport (and initial containing block) is video’s rendering area.</p>
+         <p>The video viewport (and initial containing block) is video’s rendering area.</p>
        </ol>
       <li>
        <p>Add the CSS box <var>box</var> to <var>output</var>.</p>
      </ol>
     <li>
-     <p>If <var>reset</var> is false, then, for each <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-22">WebVTT cue</a> <var>cue</var> in <var>cues</var>: if <var>cue</var>’s <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-cue-display-state">text track
+     <p>If <var>reset</var> is false, then, for each <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-26">WebVTT cue</a> <var>cue</var> in <var>cues</var>: if <var>cue</var>’s <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-cue-display-state">text track
   cue display state</a> has a set of CSS boxes, then:</p>
      <ul>
       <li>
-       <p>If <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-4">WebVTT cue region</a> is not null, add those boxes to that region’s <var>box</var> and remove <var>cue</var> from <var>cues</var>.</p>
+       <p>If <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-7">WebVTT cue region</a> is not null, add those boxes to that region’s <var>box</var> and remove <var>cue</var> from <var>cues</var>.</p>
       <li>
        <p>Otherwise, add those boxes to <var>output</var> and remove <var>cue</var> from <var>cues</var>.</p>
      </ul>
     <li>
-     <p>For each <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-23">WebVTT cue</a> <var>cue</var> in <var>cues</var> that has not yet had corresponding CSS boxes added
+     <p>For each <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-27">WebVTT cue</a> <var>cue</var> in <var>cues</var> that has not yet had corresponding CSS boxes added
   to <var>output</var>, in <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-cue-order">text track cue order</a>, run the following substeps:</p>
      <ol>
       <li>
        <p>Let <var>nodes</var> be the <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-7">list of WebVTT Node Objects</a> obtained by applying the <a data-link-type="dfn" href="#webvtt-cue-text-parsing-rules" id="ref-for-webvtt-cue-text-parsing-rules-2">WebVTT
-   cue text parsing rules</a>, with the fallback language <var>language</var> if provided, to the <var>cue</var>’s <a data-link-type="dfn" href="#text-track-cue-text" id="ref-for-text-track-cue-text-5">text track cue text</a>.</p>
+   cue text parsing rules</a>, with the fallback language <var>language</var> if provided, to the <var>cue</var>’s <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-12">cue text</a>.</p>
       <li>
-       <p>If <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-5">WebVTT cue region</a> is null, run the following substeps:</p>
+       <p>If <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-8">WebVTT cue region</a> is null, run the following substeps:</p>
        <ol>
         <li><a data-link-type="dfn" href="#apply-webvtt-cue-settings" id="ref-for-apply-webvtt-cue-settings-1">Apply WebVTT cue settings</a> to obtain CSS boxes <var>boxes</var> from <var>nodes</var>.
         <li>
@@ -4294,9 +4642,9 @@
        <p>Otherwise, run the following substeps:</p>
        <ol>
         <li>
-         <p>Let <var>region</var> be <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-6">WebVTT cue region</a>.</p>
+         <p>Let <var>region</var> be <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-9">WebVTT cue region</a>.</p>
         <li>
-         <p>If <var>region</var>’s <a data-link-type="dfn" href="#webvtt-region-scroll" id="ref-for-webvtt-region-scroll-3">WebVTT region scroll</a> setting is <a data-link-type="dfn" href="#webvtt-region-scroll-up" id="ref-for-webvtt-region-scroll-up-2">up</a> and <var>region</var> already has one child, set <var>region</var>’s <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-transitions/#transition-property">transition-property</a> to <span class="css">top</span> and <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-transitions/#transition-duration">transition-duration</a> to <span class="css">0.433s</span>.</p>
+         <p>If <var>region</var>’s <a data-link-type="dfn" href="#webvtt-region-scroll" id="ref-for-webvtt-region-scroll-3">WebVTT region scroll</a> setting is <a data-link-type="dfn" href="#webvtt-region-scroll-up" id="ref-for-webvtt-region-scroll-up-2">up</a> and <var>region</var> already has one child, set <var>region</var>’s <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-transitions/#propdef-transition-property">transition-property</a> to <span class="css">top</span> and <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-transitions/#propdef-transition-duration">transition-duration</a> to <span class="css">0.433s</span>.</p>
         <li>
          <p>Let <var>offset</var> be <var>cue</var>’s <a data-link-type="dfn" href="#cue-computed-position" id="ref-for-cue-computed-position-1">computed position</a> multiplied
      by <var>region</var>’s <a data-link-type="dfn" href="#webvtt-region-width" id="ref-for-webvtt-region-width-4">WebVTT region width</a> and divided by 100 (i.e. interpret it as a percentage
@@ -4308,17 +4656,15 @@
           <dt>If the <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-3">computed position alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-position-center-alignment" id="ref-for-webvtt-cue-position-center-alignment-3">center alignment</a>
           <dd>
            <p>Subtract half of <var>region</var>’s <a data-link-type="dfn" href="#webvtt-region-width" id="ref-for-webvtt-region-width-5">WebVTT region width</a> from <var>offset</var>.</p>
-          <dt>If the <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-4">computed position alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-4">line-right alignment</a>
+          <dt>If the <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-4">computed position alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-6">line-right alignment</a>
           <dd>
            <p>Subtract <var>region</var>’s <a data-link-type="dfn" href="#webvtt-region-width" id="ref-for-webvtt-region-width-6">WebVTT region width</a> from <var>offset</var>.</p>
          </dl>
         <li>
          <p>Let <var>left</var> be <span class="css"><var>offset</var> %</span>. <a data-link-type="biblio" href="#biblio-css-values">[CSS-VALUES]</a></p>
         <li>
-         <p>Apply the terms of the CSS specifications to <var>nodes</var> with the same constraints that are
-      used when they are applied to <var>nodes</var> of a <var>cue</var> that is not part of a region.</p>
+         <p><a data-link-type="dfn" href="#obtain-a-set-of-css-boxes" id="ref-for-obtain-a-set-of-css-boxes-1">Obtain a set of CSS boxes</a> <var>boxes</var> positioned relative to an initial containing
+     block.</p>
-         <p>Let <var>boxes</var> be the boxes generated as descendants of the initial containing block, along
-      with their positions.</p>
         <li>
          <p>If there are no line boxes in <var>boxes</var>, skip the remainder of these substeps for <var>cue</var>.
      The cue is ignored.</p>
@@ -4335,25 +4681,26 @@
    </ol>
    <p>User agents may allow the user to override the above algorithm’s positioning of cues, e.g. by
 dragging them to another location on the <a data-link-type="element" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#the-video-element">video</a>, or even off the <a data-link-type="element" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#the-video-element">video</a> entirely.</p>
-   <p>When the algorithm above requires that the user agent <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="apply-webvtt-cue-settings">apply WebVTT cue settings</dfn> to
-obtain CSS boxes from a <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-8">list of WebVTT Node Objects</a> <var>nodes</var>, the user agent must run the
-following algorithm.</p>
-   <ol class="algorithm">
+   <h3 class="heading settled algorithm" data-algorithm="Processing cue settings" data-level="7.2" id="processing-cue-settings"><span class="secno">7.2. </span><span class="content">Processing cue settings</span><a class="self-link" href="#processing-cue-settings"></a></h3>
+   <p>When the processing algorithm above requires that the user agent <dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="apply WebVTT cue settings" data-noexport="" id="apply-webvtt-cue-settings">apply WebVTT cue
+settings</dfn> to obtain CSS boxes from a <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-8">list of WebVTT Node Objects</a> <var>nodes</var>, the user agent
+must run the following algorithm.</p>
+   <ol class="algorithm" data-algorithm="apply WebVTT cue settings">
     <li>
-     <p>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-16">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-14">horizontal</a>, then let <var>writing-mode</var> be "horizontal-tb". Otherwise, if the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-17">WebVTT
+     <p>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-17">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-15">horizontal</a>, then let <var>writing-mode</var> be "horizontal-tb". Otherwise, if the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-18">WebVTT
  cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-left-writing-direction" id="ref-for-webvtt-cue-vertical-growing-left-writing-direction-5">vertical
- growing left</a>, then let <var>writing-mode</var> be "vertical-rl". Otherwise, the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-18">WebVTT cue writing
+ growing left</a>, then let <var>writing-mode</var> be "vertical-rl". Otherwise, the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-19">WebVTT cue writing
  direction</a> is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-5">vertical growing
  right</a>; let <var>writing-mode</var> be "vertical-lr".</p>
     <li>
      <p>Determine the value of <var>maximum size</var> for <var>cue</var> as per the appropriate rules from the following
   list:</p>
      <dl class="switch">
-      <dt>If the <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-5">computed position alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-position-line-left-alignment" id="ref-for-webvtt-cue-position-line-left-alignment-5">line-left</a>
+      <dt>If the <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-5">computed position alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-position-line-left-alignment" id="ref-for-webvtt-cue-position-line-left-alignment-7">line-left</a>
       <dd>
        <p>Let <var>maximum size</var> be the <a data-link-type="dfn" href="#cue-computed-position" id="ref-for-cue-computed-position-2">computed position</a> subtracted from
     100.</p>
-      <dt>If the <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-6">computed position alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-5">line-right</a>
+      <dt>If the <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-6">computed position alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-7">line-right</a>
       <dd>
        <p>Let <var>maximum size</var> be the <a data-link-type="dfn" href="#cue-computed-position" id="ref-for-cue-computed-position-3">computed position</a>.</p>
       <dt>If the <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-7">computed position alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-position-center-alignment" id="ref-for-webvtt-cue-position-center-alignment-4">center</a>, and the <a data-link-type="dfn" href="#cue-computed-position" id="ref-for-cue-computed-position-4">computed position</a> is less than or equal to 50
@@ -4366,40 +4713,40 @@
     position</a> from 100 and then multiplying the result by two.</p>
      </dl>
     <li>
-     <p>If the <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-9">WebVTT cue size</a> is less than <var>maximum size</var>, then let <var>size</var> be <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-10">WebVTT cue
+     <p>If the <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-10">WebVTT cue size</a> is less than <var>maximum size</var>, then let <var>size</var> be <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-11">WebVTT cue
  size</a>. Otherwise, let <var>size</var> be <var>maximum size</var>.</p>
     <li>
-     <p>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-19">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-15">horizontal</a>, then let <var>width</var> be <span class="css"><var>size</var> vw</span> and <var>height</var> be <span class="css">auto</span>. Otherwise, let <var>width</var> be <span class="css">auto</span> and <var>height</var> be <span class="css"><var>size</var> vh</span>.
+     <p>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-20">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-16">horizontal</a>, then let <var>width</var> be <span class="css"><var>size</var> vw</span> and <var>height</var> be <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-sizing-3/#valdef-width-auto">auto</a>. Otherwise, let <var>width</var> be <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-sizing-3/#valdef-width-auto">auto</a> and <var>height</var> be <span class="css"><var>size</var> vh</span>.
  (These are CSS values used by the next section to set CSS properties for the rendering; <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-values-4/#vw">vw</a> and <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-values-4/#vh">vh</a> are CSS units.) <a data-link-type="biblio" href="#biblio-css-values">[CSS-VALUES]</a></p>
     <li>
      <p>Determine the value of <var>x-position</var> or <var>y-position</var> for <var>cue</var> as per the appropriate rules from
   the following list:</p>
      <dl class="switch">
-      <dt>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-20">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-16">horizontal</a>
+      <dt>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-21">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-17">horizontal</a>
       <dd>
        <dl class="switch">
-        <dt>If the <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-9">computed position alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-position-line-left-alignment" id="ref-for-webvtt-cue-position-line-left-alignment-6">line-left alignment</a>
+        <dt>If the <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-9">computed position alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-position-line-left-alignment" id="ref-for-webvtt-cue-position-line-left-alignment-8">line-left alignment</a>
         <dd>
          <p>Let <var>x-position</var> be the <a data-link-type="dfn" href="#cue-computed-position" id="ref-for-cue-computed-position-8">computed position</a>.</p>
         <dt>If the <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-10">computed position alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-position-center-alignment" id="ref-for-webvtt-cue-position-center-alignment-6">center alignment</a>
         <dd>
          <p>Let <var>x-position</var> be the <a data-link-type="dfn" href="#cue-computed-position" id="ref-for-cue-computed-position-9">computed position</a> minus half
      of <var>size</var>.</p>
-        <dt>If the <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-11">computed position alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-6">line-right alignment</a>
+        <dt>If the <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-11">computed position alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-8">line-right alignment</a>
         <dd>
          <p>Let <var>x-position</var> be the <a data-link-type="dfn" href="#cue-computed-position" id="ref-for-cue-computed-position-10">computed position</a> minus <var>size</var>.</p>
        </dl>
-      <dt>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-21">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-left-writing-direction" id="ref-for-webvtt-cue-vertical-growing-left-writing-direction-6">vertical growing left</a> or <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-6">vertical growing right</a>
+      <dt>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-22">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-left-writing-direction" id="ref-for-webvtt-cue-vertical-growing-left-writing-direction-6">vertical growing left</a> or <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-6">vertical growing right</a>
       <dd>
        <dl class="switch">
-        <dt>If the <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-12">computed position alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-position-line-left-alignment" id="ref-for-webvtt-cue-position-line-left-alignment-7">line-left alignment</a>
+        <dt>If the <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-12">computed position alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-position-line-left-alignment" id="ref-for-webvtt-cue-position-line-left-alignment-9">line-left alignment</a>
         <dd>
          <p>Let <var>y-position</var> be the <a data-link-type="dfn" href="#cue-computed-position" id="ref-for-cue-computed-position-11">computed position</a>.</p>
         <dt>If the <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-13">computed position alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-position-center-alignment" id="ref-for-webvtt-cue-position-center-alignment-7">center alignment</a>
         <dd>
          <p>Let <var>y-position</var> be the <a data-link-type="dfn" href="#cue-computed-position" id="ref-for-cue-computed-position-12">computed position</a> minus half
      of <var>size</var>.</p>
-        <dt>If the <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-14">computed position alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-7">line-right alignment</a>
+        <dt>If the <a data-link-type="dfn" href="#cue-computed-position-alignment" id="ref-for-cue-computed-position-alignment-14">computed position alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-9">line-right alignment</a>
         <dd>
          <p>Let <var>y-position</var> be the <a data-link-type="dfn" href="#cue-computed-position" id="ref-for-cue-computed-position-13">computed position</a> minus <var>size</var>.</p>
        </dl>
@@ -4407,23 +4754,23 @@
     <li>
      <p>Determine the value of whichever of <var>x-position</var> or <var>y-position</var> is not yet calculated for <var>cue</var> as per the appropriate rules from the following list:</p>
      <dl class="switch">
-      <dt>If the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-11">WebVTT cue snap-to-lines flag</a> is false
+      <dt>If the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-10">WebVTT cue snap-to-lines flag</a> is false
       <dd>
        <dl class="switch">
-        <dt>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-22">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-17">horizontal</a>
+        <dt>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-23">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-18">horizontal</a>
         <dd>
          <p>Let <var>y-position</var> be the <a data-link-type="dfn" href="#cue-computed-line" id="ref-for-cue-computed-line-2">computed line</a>.</p>
-        <dt>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-23">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-left-writing-direction" id="ref-for-webvtt-cue-vertical-growing-left-writing-direction-7">vertical growing left</a> or <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-7">vertical growing right</a>
+        <dt>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-24">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-left-writing-direction" id="ref-for-webvtt-cue-vertical-growing-left-writing-direction-7">vertical growing left</a> or <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-7">vertical growing right</a>
         <dd>
          <p>Let <var>x-position</var> be the <a data-link-type="dfn" href="#cue-computed-line" id="ref-for-cue-computed-line-3">computed line</a>.</p>
        </dl>
-      <dt>If the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-12">WebVTT cue snap-to-lines flag</a> is true
+      <dt>If the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-11">WebVTT cue snap-to-lines flag</a> is true
       <dd>
        <dl class="switch">
-        <dt>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-24">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-18">horizontal</a>
+        <dt>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-25">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-19">horizontal</a>
         <dd>
          <p>Let <var>y-position</var> be 0.</p>
-        <dt>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-25">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-left-writing-direction" id="ref-for-webvtt-cue-vertical-growing-left-writing-direction-8">vertical growing left</a> or <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-8">vertical growing right</a>
+        <dt>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-26">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-left-writing-direction" id="ref-for-webvtt-cue-vertical-growing-left-writing-direction-8">vertical growing left</a> or <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-8">vertical growing right</a>
         <dd>
          <p>Let <var>x-position</var> be 0.</p>
        </dl>
@@ -4431,157 +4778,30 @@
      <p class="note" role="note">These are not final positions, they are merely temporary positions used to
   calculate box dimensions below.</p>
     <li>
-     <p>If the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-13">WebVTT cue snap-to-lines flag</a> is true, then run the appropriate steps from the
-  following list:</p>
-     <dl class="switch">
-      <dt>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-26">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-19">horizontal</a>
-      <dd>
-       <ol>
-        <li>
-         <p>Let <var>edge margin</var> be a user-agent-defined horizontal length, expressed as a percentage
-     of the width of the <var>video</var>’s rendering area, which will be used to define a margin at the left
-     and right edges of the video into which this cue will not be placed. In situations with
-     overscan, this margin should be sufficient to place the cue within the title-safe area. In the
-     absence of overscan, this value should be picked for aesthetics (to avoid text being aligned
-     precisely on the left or right edge of the video, which can be ugly).</p>
-        <li>
-         <p>If <var>x-position</var> is less than <var>edge margin</var> and the sum of <var>x-position</var> and <var>size</var> is
-     more than <var>edge margin</var>, then increase <var>x-position</var> by <var>edge margin</var> and decrease <var>size</var> by the
-     same amount.</p>
-        <li>
-         <p>Let <var>right margin edge</var> be 100 minus <var>edge margin</var>.</p>
-        <li>
-         <p>If <var>x-position</var> is less than <var>right margin edge</var>, and the sum of <var>x-position</var> and <var>size</var> is more than <var>right margin edge</var>, then decrease <var>size</var> by <var>edge margin</var>.</p>
-       </ol>
-      <dt>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-27">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-left-writing-direction" id="ref-for-webvtt-cue-vertical-growing-left-writing-direction-9">vertical growing left</a> or <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-9">vertical growing right</a>
-      <dd>
-       <ol>
-        <li>
-         <p>Let <var>edge margin</var> be a user-agent-defined vertical length, expressed as a percentage of
-     the height of the <var>video</var>’s rendering area, which will be used to define a margin at the top
-     and bottom edges of the video into which this cue will not be placed. In situations with
-     overscan, this margin should be sufficient to place the cue within the title-safe area. In the
-     absence of overscan, this value should be picked for aesthetics (to avoid text being aligned
-     precisely on the top or bottom edge of the video, which can be ugly).</p>
-        <li>
-         <p>If <var>y-position</var> is less than <var>edge margin</var> and the sum of <var>y-position</var> and <var>size</var> is
-     more than <var>edge margin</var>, then increase <var>y-position</var> by <var>edge margin</var> and decrease <var>size</var> by the
-     same amount.</p>
-        <li>
-         <p>Let <var>bottom margin edge</var> be 100 minus <var>edge margin</var>.</p>
-        <li>
-         <p>If <var>y-position</var> is less than <var>bottom margin edge</var>, and the sum of <var>y-position</var> and <var>size</var> is more than <var>right margin edge</var>, then decrease <var>size</var> by <var>edge margin</var>.</p>
-       </ol>
-     </dl>
-    <li>
      <p>Let <var>left</var> be <span class="css"><var>x-position</var> vw</span> and <var>top</var> be <span class="css"><var>y-position</var> vh</span>. (These are
  CSS values used by the next section to set CSS properties for the rendering; <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-values-4/#vw">vw</a> and <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-values-4/#vh">vh</a> are
  CSS units.) <a data-link-type="biblio" href="#biblio-css-values">[CSS-VALUES]</a></p>
     <li>
-     <p>Apply the terms of the CSS specifications to <var>nodes</var> within the following constraints, thus
-  obtaining a set of CSS boxes positioned relative to an initial containing block: <a data-link-type="biblio" href="#biblio-css22">[CSS22]</a></p>
+     <p><a data-link-type="dfn" href="#obtain-a-set-of-css-boxes" id="ref-for-obtain-a-set-of-css-boxes-2">Obtain a set of CSS boxes</a> <var>boxes</var> positioned relative to an initial containing
+ block.</p>
-     <ul>
-      <li>
-       <p>The <i>document tree</i> is the tree of <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-9">WebVTT Node Objects</a> rooted at <var>nodes</var>.</p>
-      <li>
-       <p>For the purpose of selectors in STYLE blocks of a WebVTT file, the style sheet must apply to
-    a hypothetical document that contains a single empty element with no explicit name, no
-    namespace, no attributes, no classes, no IDs, and unknown primary language, that acts like the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media element</a> for the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text tracks</a> that were sourced from the given WebVTT file.
-    The selectors must not match other <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text tracks</a> for the same <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media element</a>. In this
-    hypothetical document, the element must not match any selector that would match the element
-    itself.</p>
-       <p class="note" role="note">This element exists only to be the <a data-link-type="dfn" href="https://www.w3.org/TR/selectors4/#originating-element">originating element</a> for
-    the <span class="css">::cue</span>, <span class="css">::cue()</span>, <span class="css">::cue-region</span> and <span class="css">::cue-region()</span> pseudo-elements.</p>
-      <li>
-       <p>For the purpose of determining the <a data-link-type="dfn" href="https://drafts.csswg.org/css-cascade-4/#cascade">cascade</a> of the declarations in
-    STYLE blocks of a WebVTT file, the relative order of appearance of the style sheets must be the
-    same order as they were added to the collection, and the order of appearance of the collection
-    must be after any style sheets that apply to the associated <a data-link-type="element" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#the-video-element">video</a> element’s
-    document.</p>
-       <div class="example" id="example-29aea910">
-        <a class="self-link" href="#example-29aea910"></a>
-        <p>For example, given the following (invalid) HTML document:</p>
-<pre>&lt;!doctype html>
-&lt;title>Invalid cascade example&lt;/title>
-&lt;video controls autoplay src="video.webm">
- &lt;track default src="track.vtt">
-&lt;/video>
-&lt;style>
- ::cue { color:red }
-&lt;/style>
-</pre>
-        <p>...and the "track.vtt" file contains:</p>
-<pre>WEBVTT
-            -
-STYLE
-::cue { color:lime }
-            -
-00:00:00.000 --> 00:00:25.000
-Red or green?
-</pre>
-        <p>The <span class="css">color:lime</span> declaration would win, because it is last in the <a data-link-type="dfn" href="https://drafts.csswg.org/css-cascade-4/#cascade">cascade</a>, even though the <a data-link-type="element" href="https://www.w3.org/TR/html51/document-metadata.html#the-style-element">style</a> element is after the <a data-link-type="element" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#the-video-element">video</a> element in the document order.</p>
-       </div>
-      <li>
-       <p id="style-no-external-resources">For the purpose of resolving URLs in STYLE blocks of a WebVTT
-    file, or any URLs in resources referenced from STYLE blocks of a WebVTT file, if the URL’s
-    scheme is not "<code>data</code>", then the user agent must act as if the URL failed to
-    resolve.</p>
-       <p><strong class="advisement">Supporting external resources with <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-cascade-4/#at-ruledef-import">@import</a> or <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-background/#background-image">background-image</a> would be a new ability for <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media elements</a> and <a data-link-type="element" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#the-track-element">track</a> elements to issue
-    network requests as the user watches the video, which could be a privacy issue.</strong></p>
-      <li>
-       <p>For the purposes of processing by the CSS specification, <a data-link-type="dfn" href="#webvtt-internal-node-object" id="ref-for-webvtt-internal-node-object-9">WebVTT Internal Node Objects</a> are equivalent to elements with the same
-   contents.</p>
-      <li>For the purposes of processing by the CSS specification, <a data-link-type="dfn" href="#webvtt-text-object" id="ref-for-webvtt-text-object-7">WebVTT
-   Text Objects</a> are equivalent to <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/dom/#text">Text</a></code> nodes.
-      <li>No style sheets are associated with <var>nodes</var>. (The nodes are subsequently restyled using style
-   sheets after their boxes are generated, as described below.)
-      <li>The children of the <var>nodes</var> must be wrapped in an anonymous box whose <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-display-3/#propdef-display">display</a> property has
-   the value <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css-display-3/#valdef-display-inline">inline</a>. This is the <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-cue-background-box">WebVTT cue background box</dfn>.
-      <li>Runs of children of <a data-link-type="dfn" href="#webvtt-ruby-object" id="ref-for-webvtt-ruby-object-5">WebVTT Ruby Objects</a> that are not <a data-link-type="dfn" href="#webvtt-ruby-text-object" id="ref-for-webvtt-ruby-text-object-6">WebVTT Ruby Text Objects</a> must be wrapped in anonymous boxes
-   whose <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-display-3/#propdef-display">display</a> property has the value <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-ruby-1/#valdef-display-ruby-base">ruby-base</a>. <a data-link-type="biblio" href="#biblio-css3-ruby">[CSS3-RUBY]</a>
-      <li>Properties on <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-10">WebVTT Node Objects</a> have their values set as
-   defined in the next section. (That section uses some of the variables whose values were
-   calculated earlier in this algorithm.)
-      <li>Text runs must be wrapped according to the CSS line-wrapping rules.
-      <li>The viewport (and initial containing block) is <var>video</var>’s rendering area.
-     </ul>
-     <p>Let <var>boxes</var> be the boxes generated as descendants of the initial containing block, along with
-  their positions.</p>
     <li>
      <p>If there are no line boxes in <var>boxes</var>, skip the remainder of these substeps for <var>cue</var>. The
  cue is ignored.</p>
     <li>
      <p>Adjust the positions of <var>boxes</var> according to the appropriate steps from the following list:</p>
      <dl class="switch">
-      <dt>If <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-14">WebVTT cue snap-to-lines flag</a> is true
+      <dt>If <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-12">WebVTT cue snap-to-lines flag</a> is true
       <dd>
-       <p>Many of the steps in this algorithm vary according to the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-28">WebVTT cue writing
-    direction</a>. Steps labeled "<strong>Horizontal</strong>" must be followed only when the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-29">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-20">horizontal</a>, steps labeled "<strong>Vertical</strong>" must be followed when the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-30">WebVTT cue writing direction</a> is either <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-left-writing-direction" id="ref-for-webvtt-cue-vertical-growing-left-writing-direction-10">vertical growing left</a> or <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-10">vertical growing right</a>, steps labeled "<strong>Vertical Growing Left</strong>"
-    must be followed only when the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-31">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-left-writing-direction" id="ref-for-webvtt-cue-vertical-growing-left-writing-direction-11">vertical growing left</a>, and steps labeled "<strong>Vertical
-    Growing Right</strong>" must be followed only when the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-32">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-11">vertical growing right</a>.</p>
-       <ol>
+       <p>Many of the steps in this algorithm vary according to the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-27">WebVTT cue writing
+    direction</a>. Steps labeled "<strong>Horizontal</strong>" must be followed only when the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-28">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-20">horizontal</a>, steps labeled "<strong>Vertical</strong>" must be followed when the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-29">WebVTT cue writing direction</a> is either <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-left-writing-direction" id="ref-for-webvtt-cue-vertical-growing-left-writing-direction-9">vertical growing left</a> or <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-9">vertical growing right</a>, steps labeled "<strong>Vertical Growing Left</strong>"
+    must be followed only when the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-30">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-left-writing-direction" id="ref-for-webvtt-cue-vertical-growing-left-writing-direction-10">vertical growing left</a>, and steps labeled "<strong>Vertical
+    Growing Right</strong>" must be followed only when the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-31">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-10">vertical growing right</a>.</p>
+       <ol>
-        <li>
-         <p><strong>Horizontal</strong>: Let <var>margin</var> be a user-agent-defined vertical length which
-      will be used to define a margin at the top and bottom edges of the video into which cues will
-      not be placed. In situations with overscan, this margin should be sufficient to place all cues
-      within the title-safe area. In the absence of overscan, this value should be picked for
-      aesthetics (to avoid text being aligned precisely on the bottom edge of the video, which can
-      be ugly).</p>
-         <p><strong>Vertical</strong>: Let <var>margin</var> be a user-agent-defined horizontal length which
-      will be used to define a margin at the left and right edges of the video into which cues will
-      not be placed. In situations with overscan, this margin should be sufficient to place all cues
-      within the title-safe area. In the absence of overscan, this value should be picked for
-      aesthetics (to avoid text being aligned precisely on the left or right edges of the video,
-      which can be ugly).</p>
         <li>
          <p><strong>Horizontal</strong>: Let <var>full dimension</var> be the height of <var>video</var>’s rendering
       area.</p>
          <p><strong>Vertical</strong>: Let <var>full dimension</var> be the width of <var>video</var>’s rendering
       area.</p>
-         <p>These dimensions must not be adjusted for overscan. (The algorithm does that
-      separately.)</p>
-        <li>
-         <p>Let <var>max dimension</var> be <var>full dimension</var> - (2 × <var>margin</var>).</p>
         <li>
          <p><strong>Horizontal</strong>: Let <var>step</var> be the height of the first line box in <var>boxes</var>.</p>
          <p><strong>Vertical</strong>: Let <var>step</var> be the width of the first line box in <var>boxes</var>.</p>
@@ -4600,7 +4820,6 @@
      box of the boxes in <var>boxes</var>, then increase <var>position</var> by <var>step</var>.</p>
         <li>
          <p>If <var>line</var> is less than zero then increase <var>position</var> by <var>max dimension</var>, and negate <var>step</var>.</p>
-         <p>Otherwise, increase <var>position</var> by <var>margin</var>.</p>
         <li>
          <p><strong>Horizontal</strong>: Move all the boxes in <var>boxes</var> down by the distance given by <var>position</var>.</p>
          <p><strong>Vertical</strong>: Move all the boxes in <var>boxes</var> right by the distance given by <var>position</var>.</p>
@@ -4608,11 +4827,7 @@
          <p>Remember the position of all the boxes in <var>boxes</var> as their <var>specified
      position</var>.</p>
         <li>
-         <p><strong>Horizontal</strong>: Let <var>title area</var> be a box that covers all of the <var>video</var>’s
+         <p>Let <var>title area</var> be a box that covers all of the <var>video</var>’s rendering area.</p>
-      rendering area except for a height of <var>margin</var> at the top of the rendering area and a height
-      of <var>margin</var> at the bottom of the rendering area.</p>
-         <p><strong>Vertical</strong>: Let <var>title area</var> be a box that covers all of the <var>video</var>’s
-      rendering area except for a width of <var>margin</var> at the left of the rendering area and a width of <var>margin</var> at the right of the rendering area.</p>
         <li>
          <p><i>Step loop</i>: If none of the boxes in <var>boxes</var> would overlap any of the boxes in <var>output</var>, and all of the boxes in <var>boxes</var> are entirely within the <var>title area</var> box, then jump
      to the step labeled <i>done positioning</i> below.</p>
@@ -4642,7 +4857,7 @@
         <li>
          <p>Jump back to the step labeled <i>step loop</i>.</p>
        </ol>
-      <dt>If <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-15">WebVTT cue snap-to-lines flag</a> is false
+      <dt>If <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-13">WebVTT cue snap-to-lines flag</a> is false
       <dd>
        <ol>
         <li>
@@ -4650,7 +4865,7 @@
         <li>
          <p>Run the appropriate steps from the following list:</p>
          <dl class="switch">
-          <dt>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-33">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-21">horizontal</a>
+          <dt>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-32">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-21">horizontal</a>
           <dd>
            <dl class="switch">
             <dt>If the <a data-link-type="dfn" href="#webvtt-cue-line-alignment" id="ref-for-webvtt-cue-line-alignment-10">WebVTT cue line alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-line-center-alignment" id="ref-for-webvtt-cue-line-center-alignment-3">center alignment</a>
@@ -4661,7 +4876,7 @@
             <dd>
              <p>Move all the boxes in <var>boxes</var> up by the height of <var>bounding box</var>.</p>
            </dl>
-          <dt>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-34">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-left-writing-direction" id="ref-for-webvtt-cue-vertical-growing-left-writing-direction-12">vertical growing left</a> or <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-12">vertical growing right</a>
+          <dt>If the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-33">WebVTT cue writing direction</a> is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-left-writing-direction" id="ref-for-webvtt-cue-vertical-growing-left-writing-direction-11">vertical growing left</a> or <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-11">vertical growing right</a>
           <dd>
            <dl class="switch">
             <dt>If the <a data-link-type="dfn" href="#webvtt-cue-line-alignment" id="ref-for-webvtt-cue-line-alignment-12">WebVTT cue line alignment</a> is <a data-link-type="dfn" href="#webvtt-cue-line-center-alignment" id="ref-for-webvtt-cue-line-center-alignment-4">center alignment</a>
@@ -4692,7 +4907,74 @@
     <li>
      <p><i>Done positioning</i>: Return <var>boxes</var>.</p>
    </ol>
-   <h4 class="heading settled algorithm" data-algorithm="Applying CSS properties to WebVTT Node Objects" data-level="6.1.1" id="applying-css-properties"><span class="secno">6.1.1. </span><span class="content">Applying CSS properties to <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-11">WebVTT Node Objects</a></span><a class="self-link" href="#applying-css-properties"></a></h4>
+   <h3 class="heading settled algorithm" data-algorithm="Obtaining CSS boxes" data-level="7.3" id="obtaining-css-boxes"><span class="secno">7.3. </span><span class="content">Obtaining CSS boxes</span><a class="self-link" href="#obtaining-css-boxes"></a></h3>
+   <p>When the processing algorithm above requires that the user agent <dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="obtain a set of CSS boxes" data-noexport="" id="obtain-a-set-of-css-boxes">obtain a set of CSS
+boxes</dfn> <var>boxes</var>, then apply the terms of the CSS specifications to <var>nodes</var> within the following
+constraints: <a data-link-type="biblio" href="#biblio-css22">[CSS22]</a></p>
+   <ul>
+    <li>
+     <p>The <i>document tree</i> is the tree of <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-9">WebVTT Node Objects</a> rooted at <var>nodes</var>.</p>
+    <li>
+     <p>For the purpose of selectors in STYLE blocks of a WebVTT file, the style sheet must apply to a
+  hypothetical document that contains a single empty element with no explicit name, no namespace, no
+  attributes, no classes, no IDs, and unknown primary language, that acts like the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media
+  element</a> for the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text tracks</a> that were sourced from the given WebVTT file. The selectors
+  must not match other <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text tracks</a> for the same <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media element</a>. In this hypothetical
+  document, the element must not match any selector that would match the element itself.</p>
+     <p class="note" role="note">This element exists only to be the <a data-link-type="dfn" href="https://www.w3.org/TR/selectors4/#originating-element">originating element</a> for the <span class="css">::cue</span>, <span class="css">::cue()</span>, <span class="css">::cue-region</span> and <span class="css">::cue-region()</span> pseudo-elements.</p>
+    <li>
+     <p>For the purpose of determining the <a data-link-type="dfn" href="https://www.w3.org/TR/css-cascade-4/#cascade">cascade</a> of the declarations in STYLE
+  blocks of a WebVTT file, the relative order of appearance of the style sheets must be the same
+  order as they were added to the collection, and the order of appearance of the collection must be
+  after any style sheets that apply to the associated <a data-link-type="element" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#the-video-element">video</a> element’s document.</p>
+     <div class="example" id="example-01d14f75">
+      <a class="self-link" href="#example-01d14f75"></a>
+      <p>For example, given the following (invalid) HTML document:</p>
+<pre>&lt;!doctype html>
+&lt;title>Invalid cascade example&lt;/title>
+&lt;video controls autoplay src="video.webm">
+ &lt;track default src="track.vtt">
+&lt;/video>
+&lt;style>
+ ::cue { color:red }
+&lt;/style>
+</pre>
+      <p>...and the "track.vtt" file contains:</p>
+<pre>WEBVTT
+            +
+STYLE
+::cue { color:lime }
+            +
+00:00:00.000 --> 00:00:25.000
+Red or green?
+</pre>
+      <p>The <span class="css">color:lime</span> declaration would win, because it is last in the <a data-link-type="dfn" href="https://www.w3.org/TR/css-cascade-4/#cascade">cascade</a>, even though the <a data-link-type="element" href="https://www.w3.org/TR/html51/document-metadata.html#the-style-element">style</a> element is after the <a data-link-type="element" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#the-video-element">video</a> element in the document order.</p>
+     </div>
+    <li>
+     <p id="style-no-external-resources">For the purpose of resolving URLs in STYLE blocks of a WebVTT
+  file, or any URLs in resources referenced from STYLE blocks of a WebVTT file, if the URL’s scheme
+  is not "<code>data</code>", then the user agent must act as if the URL failed to resolve.</p>
+     <p><strong class="advisement">Supporting external resources with <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css-cascade-4/#at-ruledef-import">@import</a> or <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-background/#propdef-background-image">background-image</a> would be a new ability for <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media elements</a> and <a data-link-type="element" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#the-track-element">track</a> elements to issue
+  network requests as the user watches the video, which could be a privacy issue.</strong></p>
+    <li>
+     <p>For the purposes of processing by the CSS specification, <a data-link-type="dfn" href="#webvtt-internal-node-object" id="ref-for-webvtt-internal-node-object-9">WebVTT Internal Node Objects</a> are equivalent to elements with the same
+ contents.</p>
+    <li>For the purposes of processing by the CSS specification, <a data-link-type="dfn" href="#webvtt-text-object" id="ref-for-webvtt-text-object-7">WebVTT Text
+ Objects</a> are equivalent to <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/dom/#text">Text</a></code> nodes.
+    <li>No style sheets are associated with <var>nodes</var>. (The nodes are subsequently restyled using style
+ sheets after their boxes are generated, as described below.)
+    <li>The children of the <var>nodes</var> must be wrapped in an anonymous box whose <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-display-3/#propdef-display">display</a> property has
+ the value <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css-display-3/#valdef-display-inline">inline</a>. This is the <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="webvtt-cue-background-box">WebVTT cue background box</dfn>.
+    <li>Runs of children of <a data-link-type="dfn" href="#webvtt-ruby-object" id="ref-for-webvtt-ruby-object-5">WebVTT Ruby Objects</a> that are not <a data-link-type="dfn" href="#webvtt-ruby-text-object" id="ref-for-webvtt-ruby-text-object-6">WebVTT Ruby Text Objects</a> must be wrapped in anonymous boxes whose <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-display-3/#propdef-display">display</a> property has the value <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-ruby-1/#valdef-display-ruby-base">ruby-base</a>. <a data-link-type="biblio" href="#biblio-css3-ruby">[CSS3-RUBY]</a>
+    <li>Properties on <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-10">WebVTT Node Objects</a> have their values set as
+ defined in the next section. (That section uses some of the variables whose values were calculated
+ earlier in this algorithm.)
+    <li>Text runs must be wrapped according to the CSS line-wrapping rules.
+    <li>The video viewport (and initial containing block) is <var>video</var>’s rendering area.
+   </ul>
+   <p>Let <var>boxes</var> be the boxes generated as descendants of the initial containing block, along with
+their positions.</p>
+   <h3 class="heading settled algorithm" data-algorithm="Applying CSS properties to WebVTT Node Objects" data-level="7.4" id="applying-css-properties"><span class="secno">7.4. </span><span class="content">Applying CSS properties to <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-11">WebVTT Node Objects</a></span><a class="self-link" href="#applying-css-properties"></a></h3>
    <p>When following the <a data-link-type="dfn" href="#rules-for-updating-the-display-of-webvtt-text-tracks" id="ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-4">rules for updating the display of WebVTT text tracks</a>, user agents must
 set properties of <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-12">WebVTT Node Objects</a> at the CSS user agent cascade
 layer as defined in this section. <a data-link-type="biblio" href="#biblio-css22">[CSS22]</a></p>
@@ -4705,45 +4987,45 @@
     <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-positioning/#propdef-left">left</a> property must be set to <var>left</var>
     <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/CSS22/visudet.html#propdef-width">width</a> property must be set to <var>width</var>
     <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/CSS22/visudet.html#propdef-height">height</a> property must be set to <var>height</var>
-    <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#overflow-wrap">overflow-wrap</a> property must be set to <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-text-3/#valdef-overflow-wrap-break-word">break-word</a>
+    <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#propdef-overflow-wrap">overflow-wrap</a> property must be set to <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css-text-3/#valdef-overflow-wrap-break-word">break-word</a>
     <li>the <a class="property" data-link-type="propdesc">text-wrap</a> property must be set to <span class="css">balance</span> <a data-link-type="biblio" href="#biblio-css-text-4">[CSS-TEXT-4]</a>
    </ul>
    <p>The variables <var>writing-mode</var>, <var>top</var>, <var>left</var>, <var>width</var>, and <var>height</var> are the values with those
-names determined by the <a data-link-type="dfn" href="#rules-for-updating-the-display-of-webvtt-text-tracks" id="ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-5">rules for updating the display of WebVTT text tracks</a> for the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-24">WebVTT cue</a> from whose <a data-link-type="dfn" href="#text-track-cue-text" id="ref-for-text-track-cue-text-6">text</a> the <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-10">list of WebVTT Node
-Objects</a> was constructed.</p>
-   <p>The <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#text-align">text-align</a> property on the (root) <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-11">list of WebVTT Node Objects</a> must be set to the
+names determined by the <a data-link-type="dfn" href="#rules-for-updating-the-display-of-webvtt-text-tracks" id="ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-5">rules for updating the display of WebVTT text tracks</a> for the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-28">WebVTT cue</a> from whose <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-13">text</a> the <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-10">list of WebVTT Node Objects</a> was
+constructed.</p>
+   <p>The <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#propdef-text-align">text-align</a> property on the (root) <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-11">list of WebVTT Node Objects</a> must be set to the
 value in the second cell of the row of the table below whose first cell is the value of the
-corresponding <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#cue">cue</a>’s <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-19">WebVTT cue text alignment</a>:</p>
+corresponding <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#cue">cue</a>’s <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-21">WebVTT cue text alignment</a>:</p>
    <table class="complex data">
     <thead>
      <tr>
-      <th><a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-20">WebVTT cue text alignment</a>
-      <th><a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#text-align">text-align</a> value
+      <th><a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-22">WebVTT cue text alignment</a>
+      <th><a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#propdef-text-align">text-align</a> value
     <tbody>
      <tr>
-      <td><a data-link-type="dfn" href="#webvtt-cue-start-alignment" id="ref-for-webvtt-cue-start-alignment-7">Start alignment</a>
-      <td><a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-text-3/#valdef-text-align-start">start</a>
+      <td><a data-link-type="dfn" href="#webvtt-cue-start-alignment" id="ref-for-webvtt-cue-start-alignment-8">Start alignment</a>
+      <td><a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css-text-3/#valdef-text-align-start">start</a>
      <tr>
       <td><a data-link-type="dfn" href="#webvtt-cue-center-alignment" id="ref-for-webvtt-cue-center-alignment-7">Center alignment</a>
-      <td><a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-text-3/#valdef-text-align-center">center</a>
+      <td><a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css-text-3/#valdef-text-align-center">center</a>
      <tr>
-      <td><a data-link-type="dfn" href="#webvtt-cue-end-alignment" id="ref-for-webvtt-cue-end-alignment-6">End alignment</a>
-      <td><a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-text-3/#valdef-text-align-end">end</a>
+      <td><a data-link-type="dfn" href="#webvtt-cue-end-alignment" id="ref-for-webvtt-cue-end-alignment-7">End alignment</a>
+      <td><a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css-text-3/#valdef-text-align-end">end</a>
      <tr>
       <td><a data-link-type="dfn" href="#webvtt-cue-left-alignment" id="ref-for-webvtt-cue-left-alignment-6">Left alignment</a>
-      <td><a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-text-3/#valdef-text-align-left">left</a>
+      <td><a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css-text-3/#valdef-text-align-left">left</a>
      <tr>
       <td><a data-link-type="dfn" href="#webvtt-cue-right-alignment" id="ref-for-webvtt-cue-right-alignment-6">Right alignment</a>
-      <td><a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-text-3/#valdef-text-align-right">right</a>
+      <td><a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css-text-3/#valdef-text-align-right">right</a>
    </table>
    <p>The <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-fonts-3/#propdef-font">font</a> shorthand property on the (root) <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-12">list of WebVTT Node Objects</a> must be set to <span class="css">5vh sans-serif</span>. <a data-link-type="biblio" href="#biblio-css-values">[CSS-VALUES]</a></p>
    <p>The <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-color-4/#propdef-color">color</a> property on the (root) <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-13">list of WebVTT Node Objects</a> must be set to <span class="css">rgba(255,255,255,1)</span>. <a data-link-type="biblio" href="#biblio-css3-color">[CSS3-COLOR]</a></p>
-   <p>The <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-background/#background">background</a> shorthand property on the <a data-link-type="dfn" href="#webvtt-cue-background-box" id="ref-for-webvtt-cue-background-box-1">WebVTT cue background box</a> and on <a data-link-type="dfn" href="#webvtt-ruby-text-object" id="ref-for-webvtt-ruby-text-object-7">WebVTT Ruby
+   <p>The <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-background/#propdef-background">background</a> shorthand property on the <a data-link-type="dfn" href="#webvtt-cue-background-box" id="ref-for-webvtt-cue-background-box-1">WebVTT cue background box</a> and on <a data-link-type="dfn" href="#webvtt-ruby-text-object" id="ref-for-webvtt-ruby-text-object-7">WebVTT Ruby
 Text Objects</a> must be set to <span class="css">rgba(0,0,0,0.8)</span>. <a data-link-type="biblio" href="#biblio-css3-color">[CSS3-COLOR]</a></p>
-   <p>The <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#white-space">white-space</a> property on the (root) <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-14">list of WebVTT Node Objects</a> must be set to <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-pre-line">pre-line</a>. <a data-link-type="biblio" href="#biblio-css22">[CSS22]</a></p>
+   <p>The <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#propdef-white-space">white-space</a> property on the (root) <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-14">list of WebVTT Node Objects</a> must be set to <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css-text-3/#valdef-white-space-pre-line">pre-line</a>. <a data-link-type="biblio" href="#biblio-css22">[CSS22]</a></p>
    <p>The <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-fonts-3/#propdef-font-style">font-style</a> property on <a data-link-type="dfn" href="#webvtt-italic-object" id="ref-for-webvtt-italic-object-4">WebVTT Italic Objects</a> must be set
-to <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-fonts-4/#valdef-font-style-italic">italic</a>.</p>
-   <p>The <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-fonts-3/#propdef-font-weight">font-weight</a> property on <a data-link-type="dfn" href="#webvtt-bold-object" id="ref-for-webvtt-bold-object-5">WebVTT Bold Objects</a> must be set to <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-fonts-4/#valdef-font-weight-bold">bold</a>.</p>
+to <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css-fonts-4/#valdef-font-style-italic">italic</a>.</p>
+   <p>The <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-fonts-3/#propdef-font-weight">font-weight</a> property on <a data-link-type="dfn" href="#webvtt-bold-object" id="ref-for-webvtt-bold-object-5">WebVTT Bold Objects</a> must be set to <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css-fonts-4/#valdef-font-weight-bold">bold</a>.</p>
    <p>The <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-decor-3/#text-decoration">text-decoration</a> property on <a data-link-type="dfn" href="#webvtt-underline-object" id="ref-for-webvtt-underline-object-4">WebVTT Underline Objects</a> must be set to <span class="css">underline</span>.</p>
    <p>The <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-display-3/#propdef-display">display</a> property on <a data-link-type="dfn" href="#webvtt-ruby-object" id="ref-for-webvtt-ruby-object-6">WebVTT Ruby Objects</a> must be set to <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-ruby-1/#valdef-display-ruby">ruby</a>. <a data-link-type="biblio" href="#biblio-css3-ruby">[CSS3-RUBY]</a></p>
    <p>The <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-display-3/#propdef-display">display</a> property on <a data-link-type="dfn" href="#webvtt-ruby-text-object" id="ref-for-webvtt-ruby-text-object-8">WebVTT Ruby Text Objects</a> must be
@@ -4752,8 +5034,8 @@
    <ul>
     <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-positioning/#propdef-position">position</a> property must be set to <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css3-positioning/#valdef-position-absolute">absolute</a>
     <li>the <a class="property" data-link-type="propdesc" href="https://drafts.csswg.org/css-writing-modes-4/#propdef-writing-mode">writing-mode</a> property must be set to <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-writing-modes-4/#valdef-writing-mode-horizontal-tb">horizontal-tb</a>
-    <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-background/#background">background</a> shorthand property must be set to <span class="css">rgba(0,0,0,0.8)</span>
-    <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#overflow-wrap">overflow-wrap</a> property must be set to <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-text-3/#valdef-overflow-wrap-break-word">break-word</a>
+    <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-background/#propdef-background">background</a> shorthand property must be set to <span class="css">rgba(0,0,0,0.8)</span>
+    <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#propdef-overflow-wrap">overflow-wrap</a> property must be set to <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css-text-3/#valdef-overflow-wrap-break-word">break-word</a>
     <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-fonts-3/#propdef-font">font</a> shorthand property must be set to <span class="css">5vh sans-serif</span>
     <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-color-4/#propdef-color">color</a> property must be set to <span class="css">rgba(255,255,255,1)</span>
     <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-overflow-3/#propdef-overflow">overflow</a> property must be set to <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css-overflow-3/#valdef-overflow-hidden">hidden</a>
@@ -4767,29 +5049,29 @@
     <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-align/#propdef-justify-content">justify-content</a> property must be set to <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css-flexbox-1/#valdef-justify-content-flex-end">flex-end</a>
    </ul>
    <p>The variables <var>width</var>, <var>height</var>, <var>top</var>, and <var>left</var> are the values with those names determined by
-the <a data-link-type="dfn" href="#rules-for-updating-the-display-of-webvtt-text-tracks" id="ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-6">rules for updating the display of WebVTT text tracks</a> for the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-14">WebVTT region</a> from
+the <a data-link-type="dfn" href="#rules-for-updating-the-display-of-webvtt-text-tracks" id="ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-6">rules for updating the display of WebVTT text tracks</a> for the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-15">WebVTT region</a> from
 which the <a data-link-type="dfn" href="#webvtt-region-object" id="ref-for-webvtt-region-object-7">WebVTT region object</a> was constructed.</p>
    <p>The children of every <a data-link-type="dfn" href="#webvtt-region-object" id="ref-for-webvtt-region-object-8">WebVTT region object</a> are further initialized with these CSS
 settings:</p>
    <ul>
     <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-positioning/#propdef-position">position</a> property must be set to <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css3-positioning/#valdef-position-relative">relative</a>
     <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-writing-modes-3/#propdef-unicode-bidi">unicode-bidi</a> property must be set to <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-writing-modes-4/#valdef-unicode-bidi-plaintext">plaintext</a>
-    <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/CSS22/visudet.html#propdef-width">width</a> property must be set to <span class="css">auto</span>
+    <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/CSS22/visudet.html#propdef-width">width</a> property must be set to <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/css-sizing-3/#valdef-width-auto">auto</a>
     <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/CSS22/visudet.html#propdef-height">height</a> property must be set to <var>height</var>
     <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-positioning/#propdef-left">left</a> property must be set to <var>left</var>
-    <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#text-align">text-align</a> property must be set as described for the root <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-15">List of WebVTT Node
+    <li>the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#propdef-text-align">text-align</a> property must be set as described for the root <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-15">List of WebVTT Node
  Objects</a> not part of a region
    </ul>
    <p>All other non-inherited properties must be set to their initial values; inherited properties on
-the root <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-16">list of WebVTT Node Objects</a> must inherit their values from the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media element</a> for which the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-25">WebVTT cue</a> is being rendered, if any. If there is no <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media element</a> (i.e.
+the root <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-16">list of WebVTT Node Objects</a> must inherit their values from the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media element</a> for which the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-29">WebVTT cue</a> is being rendered, if any. If there is no <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media element</a> (i.e.
 if the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text track</a> is being rendered for another media playback mechanism), then inherited
 properties on the root <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-17">list of WebVTT Node Objects</a> and the <a data-link-type="dfn" href="#webvtt-region-object" id="ref-for-webvtt-region-object-9">WebVTT region objects</a> must take their initial values.</p>
    <p>If there are style sheets that apply to the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media element</a> or other playback mechanism,
 then they must be interpreted as defined in the next section.</p>
-   <h2 class="heading settled" data-level="7" id="css-extensions"><span class="secno">7. </span><span class="content">CSS extensions</span><a class="self-link" href="#css-extensions"></a></h2>
+   <h2 class="heading settled" data-level="8" id="css-extensions"><span class="secno">8. </span><span class="content">CSS extensions</span><a class="self-link" href="#css-extensions"></a></h2>
    <p class="note" role="note">This section specifies some CSS pseudo-elements and pseudo-classes and how they
-apply to WebVTT. This section does not apply to user agents that don’t support CSS.</p>
-   <h3 class="heading settled" data-level="7.1" id="css-extensions-introduction"><span class="secno">7.1. </span><span class="content">Introduction</span><a class="self-link" href="#css-extensions-introduction"></a></h3>
+apply to WebVTT. This section does not apply to <a data-link-type="dfn" href="#user-agents-that-do-not-support-css" id="ref-for-user-agents-that-do-not-support-css-2">user agents that do not support CSS</a>.</p>
+   <h3 class="heading settled" data-level="8.1" id="css-extensions-introduction"><span class="secno">8.1. </span><span class="content">Introduction</span><a class="self-link" href="#css-extensions-introduction"></a></h3>
    <p><i>This section is non-normative.</i></p>
    <p>The <span class="css">::cue</span> pseudo-element represents a cue.</p>
    <p>The <span class="css">::cue(<var>selector</var>)</span> pseudo-element represents a cue or element inside a cue that match the
@@ -4799,7 +5081,7 @@
 that match the given selector.</p>
    <p class="note" role="note">Similarly to all other pseudo-elements, these pseudo-elements are not directly
 present in the <code><a data-link-type="element" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#the-video-element">video</a></code> element’s document tree.</p>
-   <p>The <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/selectors-4/#past-pseudo">:past</a> and <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/selectors4/#future-pseudo">:future</a> pseudo-classes can be used in <span class="css">::cue(<var>selector</var>)</span> to match <a data-link-type="dfn" href="#webvtt-internal-node-object" id="ref-for-webvtt-internal-node-object-10">WebVTT Internal Node Objects</a> based on the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#current-position">current playback position</a>.</p>
+   <p>The <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/selectors4/#past-pseudo">:past</a> and <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/selectors4/#future-pseudo">:future</a> pseudo-classes can be used in <span class="css">::cue(<var>selector</var>)</span> to match <a data-link-type="dfn" href="#webvtt-internal-node-object" id="ref-for-webvtt-internal-node-object-10">WebVTT Internal Node Objects</a> based on the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#current-position">current playback position</a>.</p>
    <div class="example" id="example-cue-selector">
     <a class="self-link" href="#example-cue-selector"></a>
     <p>The following table shows examples of what can be selected with a given selector, together with
@@ -4828,7 +5110,7 @@
 </pre>
       <tr>
        <td class="long">
-        <p><a data-link-type="dfn" href="https://drafts.csswg.org/selectors-4/#id-selector">ID selector</a> in <span class="css">::cue()</span></p>
+        <p><a data-link-type="dfn" href="https://www.w3.org/TR/selectors4/#id-selector">ID selector</a> in <span class="css">::cue()</span></p>
 <pre>video::cue(#cue1) {
   color: yellow;
 }</pre>
@@ -4842,7 +5124,7 @@
 </pre>
       <tr>
        <td class="long">
-        <p><a data-link-type="dfn" href="https://drafts.csswg.org/selectors-4/#type-selector">Type selector</a> in <span class="css">::cue()</span></p>
+        <p><a data-link-type="dfn" href="https://www.w3.org/TR/selectors4/#type-selector">Type selector</a> in <span class="css">::cue()</span></p>
 <pre>video::cue(c),
 video::cue(i),
 video::cue(b),
@@ -4871,7 +5153,7 @@
 </pre>
       <tr>
        <td class="long">
-        <p><a data-link-type="dfn" href="https://drafts.csswg.org/selectors-4/#class-selector">Class selector</a> in <span class="css">::cue()</span></p>
+        <p><a data-link-type="dfn" href="https://www.w3.org/TR/selectors4/#class-selector">Class selector</a> in <span class="css">::cue()</span></p>
 <pre>video::cue(.loud) {
   color: yellow;
 }</pre>
@@ -4892,7 +5174,7 @@
 </pre>
       <tr>
        <td class="long">
-        <p><a data-link-type="dfn" href="https://drafts.csswg.org/selectors-4/#attribute-selector">Attribute selector</a> in <span class="css">::cue()</span></p>
+        <p><a data-link-type="dfn" href="https://www.w3.org/TR/selectors4/#attribute-selector">Attribute selector</a> in <span class="css">::cue()</span></p>
 <pre>video::cue([lang="en-US"]) {
   color: yellow;
 }
@@ -4921,7 +5203,7 @@
      of WebVTT Node Objects</a> can be set by the <code><a data-link-type="element-sub" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#dom-htmltrackelement-srclang">srclang</a></code> attribute in HTML.</p>
 <pre>&lt;video ...>
  &lt;track src="example-attr.vtt"
-        <mark>srclang="en-US"</mark> default>
+        srclang="en-US" default>
 &lt;/video>
 </pre>
       <tr>
@@ -4949,7 +5231,7 @@
      HTML.</p>
       <tr>
        <td class="long">
-        <p><a class="css" data-link-type="maybe" href="https://drafts.csswg.org/selectors-4/#past-pseudo">:past</a> and <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/selectors4/#future-pseudo">:future</a> pseudo-classes in <span class="css">::cue()</span></p>
+        <p><a class="css" data-link-type="maybe" href="https://www.w3.org/TR/selectors4/#past-pseudo">:past</a> and <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/selectors4/#future-pseudo">:future</a> pseudo-classes in <span class="css">::cue()</span></p>
 <pre>video::cue(:past) {
   color: yellow;
 }
@@ -4998,7 +5280,7 @@
 </pre>
       <tr>
        <td class="long">
-        <p><a data-link-type="dfn" href="https://drafts.csswg.org/selectors-4/#id-selector">ID selector</a> in <span class="css">::cue-region()</span></p>
+        <p><a data-link-type="dfn" href="https://www.w3.org/TR/selectors4/#id-selector">ID selector</a> in <span class="css">::cue-region()</span></p>
 <pre>video::cue-region(#scroll) {
   color: cyan;
 }</pre>
@@ -5030,25 +5312,25 @@
 </pre>
     </table>
    </div>
-   <h3 class="heading settled" data-level="7.2" id="css-extensions-processing-model"><span class="secno">7.2. </span><span class="content">Processing model</span><a class="self-link" href="#css-extensions-processing-model"></a></h3>
-   <p>When a user agent is rendering one or more <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-26">WebVTT cues</a> according to the <a data-link-type="dfn" href="#rules-for-updating-the-display-of-webvtt-text-tracks" id="ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-7">rules for updating the display of WebVTT text tracks</a>, <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-13">WebVTT Node
+   <h3 class="heading settled" data-level="8.2" id="css-extensions-processing-model"><span class="secno">8.2. </span><span class="content">Processing model</span><a class="self-link" href="#css-extensions-processing-model"></a></h3>
+   <p>When a user agent is rendering one or more <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-30">WebVTT cues</a> according to the <a data-link-type="dfn" href="#rules-for-updating-the-display-of-webvtt-text-tracks" id="ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-7">rules for updating the display of WebVTT text tracks</a>, <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-13">WebVTT Node
 Objects</a> in the <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-25">list of WebVTT Node Objects</a> used in the rendering can be matched by
 certain pseudo-selectors as defined below. These selectors can begin or stop matching individual <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-14">WebVTT Node Objects</a> while a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#cue">cue</a> is being
 rendered, even in between applications of the <a data-link-type="dfn" href="#rules-for-updating-the-display-of-webvtt-text-tracks" id="ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-8">rules for updating the display of WebVTT text
 tracks</a> (which are only run when the set of active cues changes). User agents that support the
-pseudo-element described below must dynamically update renderings accordingly. When either <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#white-space">white-space</a> or one of the properties corresponding to the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-fonts-3/#propdef-font">font</a> shorthand (including <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/CSS22/visudet.html#propdef-line-height">line-height</a>) changes value, then the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-27">WebVTT cue</a>’s <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-cue-display-state">text track cue display state</a> must
+pseudo-element described below must dynamically update renderings accordingly. When either <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#propdef-white-space">white-space</a> or one of the properties corresponding to the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-fonts-3/#propdef-font">font</a> shorthand (including <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/CSS22/visudet.html#propdef-line-height">line-height</a>) changes value, then the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-31">WebVTT cue</a>’s <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-cue-display-state">text track cue display state</a> must
 be emptied and the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text track</a>’s <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#rules-for-updating-the-text-track-rendering">rules for updating the text track rendering</a> must be
 immediately rerun.</p>
    <p>Pseudo-elements apply to elements that are matched by selectors. For the purpose of this section,
 that element is the <i>matched element</i>. The pseudo-elements defined in the following sections
-affect the styling of parts of <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-28">WebVTT cues</a> that are being rendered for the <i>matched element</i>.</p>
+affect the styling of parts of <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-32">WebVTT cues</a> that are being rendered for the <i>matched element</i>.</p>
    <p class="note" role="note">If the <i>matched element</i> is not a <a data-link-type="element" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#the-video-element">video</a> element, the
 pseudo-elements defined below won’t have any effect according to this specification.</p>
-   <p>A CSS user agent that implements the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text tracks</a> model must implement the <span class="css">::cue</span>, <span class="css">::cue(<var>selector</var>)</span>, <span class="css">::cue-region</span> and <span class="css">::cue-region(<var>selector</var>)</span> pseudo-elements, and the <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/selectors-4/#past-pseudo">:past</a> and <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/selectors4/#future-pseudo">:future</a> pseudo-classes.</p>
-   <h4 class="heading settled" data-level="7.2.1" id="the-cue-pseudo-element"><span class="secno">7.2.1. </span><span class="content">The <span class="css">::cue</span> pseudo-element</span><a class="self-link" href="#the-cue-pseudo-element"></a></h4>
+   <p>A CSS user agent that implements the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text tracks</a> model must implement the <span class="css">::cue</span>, <span class="css">::cue(<var>selector</var>)</span>, <span class="css">::cue-region</span> and <span class="css">::cue-region(<var>selector</var>)</span> pseudo-elements, and the <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/selectors4/#past-pseudo">:past</a> and <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/selectors4/#future-pseudo">:future</a> pseudo-classes.</p>
+   <h4 class="heading settled" data-level="8.2.1" id="the-cue-pseudo-element"><span class="secno">8.2.1. </span><span class="content">The <span class="css">::cue</span> pseudo-element</span><a class="self-link" href="#the-cue-pseudo-element"></a></h4>
    <p>The <dfn data-dfn-type="dfn" data-noexport="" id="cue">::cue<a class="self-link" href="#cue"></a></dfn> pseudo-element (with no argument) matches any <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-26">list of WebVTT Node
 Objects</a> constructed for the <i>matched element</i>, with the exception that the properties
-corresponding to the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-background/#background">background</a> shorthand must be applied to the <a data-link-type="dfn" href="#webvtt-cue-background-box" id="ref-for-webvtt-cue-background-box-2">WebVTT cue background box</a> rather than the <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-27">list of WebVTT Node Objects</a>.</p>
+corresponding to the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-background/#propdef-background">background</a> shorthand must be applied to the <a data-link-type="dfn" href="#webvtt-cue-background-box" id="ref-for-webvtt-cue-background-box-2">WebVTT cue background box</a> rather than the <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-27">list of WebVTT Node Objects</a>.</p>
    <p>The following properties apply to the <span class="css">::cue</span> pseudo-element with no argument; other properties
 set on the pseudo-element must be ignored:</p>
    <ul class="brief">
@@ -5057,10 +5339,10 @@
     <li><a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/CSS22/visufx.html#propdef-visibility">visibility</a>
     <li>the properties corresponding to the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-decor-3/#text-decoration">text-decoration</a> shorthand
     <li><a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-decor-3/#text-shadow">text-shadow</a>
-    <li>the properties corresponding to the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-background/#background">background</a> shorthand
-    <li>the properties corresponding to the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-ui/#propdef-outline">outline</a> shorthand
+    <li>the properties corresponding to the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-background/#propdef-background">background</a> shorthand
+    <li>the properties corresponding to the <a class="property" data-link-type="propdesc" href="https://drafts.csswg.org/css-ui-4/#propdef-outline">outline</a> shorthand
     <li>the properties corresponding to the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-fonts-3/#propdef-font">font</a> shorthand, including <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/CSS22/visudet.html#propdef-line-height">line-height</a>
-    <li><a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#white-space">white-space</a>
+    <li><a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#propdef-white-space">white-space</a>
     <li><a class="property" data-link-type="propdesc" href="https://drafts.csswg.org/css-writing-modes-4/#propdef-text-combine-upright">text-combine-upright</a>
     <li><a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-ruby-1/#propdef-ruby-position">ruby-position</a>
    </ul>
@@ -5143,36 +5425,36 @@
     <li><a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/CSS22/visufx.html#propdef-visibility">visibility</a>
     <li>the properties corresponding to the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-decor-3/#text-decoration">text-decoration</a> shorthand
     <li><a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-decor-3/#text-shadow">text-shadow</a>
-    <li>the properties corresponding to the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-background/#background">background</a> shorthand
-    <li>the properties corresponding to the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-ui/#propdef-outline">outline</a> shorthand
+    <li>the properties corresponding to the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-background/#propdef-background">background</a> shorthand
+    <li>the properties corresponding to the <a class="property" data-link-type="propdesc" href="https://drafts.csswg.org/css-ui-4/#propdef-outline">outline</a> shorthand
     <li>properties relating to the transition and animation features
    </ul>
    <p>In addition, the following properties apply to the <span class="css">::cue()</span> pseudo-element with an argument
-when the selector does not contain the <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/selectors-4/#past-pseudo">:past</a> and <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/selectors4/#future-pseudo">:future</a> pseudo-classes:</p>
+when the selector does not contain the <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/selectors4/#past-pseudo">:past</a> and <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/selectors4/#future-pseudo">:future</a> pseudo-classes:</p>
    <ul class="brief">
     <li>the properties corresponding to the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-fonts-3/#propdef-font">font</a> shorthand, including <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/CSS22/visudet.html#propdef-line-height">line-height</a>
-    <li><a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#white-space">white-space</a>
+    <li><a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#propdef-white-space">white-space</a>
     <li><a class="property" data-link-type="propdesc" href="https://drafts.csswg.org/css-writing-modes-4/#propdef-text-combine-upright">text-combine-upright</a>
     <li><a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-ruby-1/#propdef-ruby-position">ruby-position</a>
    </ul>
    <p>Properties that do not apply must be ignored.</p>
-   <p>As a special exception, the properties corresponding to the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-background/#background">background</a> shorthand, when they
+   <p>As a special exception, the properties corresponding to the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css3-background/#propdef-background">background</a> shorthand, when they
 would have been applied to the <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-32">list of WebVTT Node Objects</a>, must instead be applied to the <a data-link-type="dfn" href="#webvtt-cue-background-box" id="ref-for-webvtt-cue-background-box-3">WebVTT cue background box</a>.</p>
-   <h4 class="heading settled" data-level="7.2.2" id="the-past-and-future-pseudo-classes"><span class="secno">7.2.2. </span><span class="content">The <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/selectors-4/#past-pseudo">:past</a> and <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/selectors4/#future-pseudo">:future</a> pseudo-classes</span><a class="self-link" href="#the-past-and-future-pseudo-classes"></a></h4>
-   <p>The <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/selectors-4/#past-pseudo">:past</a> and <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/selectors4/#future-pseudo">:future</a> pseudo-classes sometimes match <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-16">WebVTT
+   <h4 class="heading settled" data-level="8.2.2" id="the-past-and-future-pseudo-classes"><span class="secno">8.2.2. </span><span class="content">The <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/selectors4/#past-pseudo">:past</a> and <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/selectors4/#future-pseudo">:future</a> pseudo-classes</span><a class="self-link" href="#the-past-and-future-pseudo-classes"></a></h4>
+   <p>The <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/selectors4/#past-pseudo">:past</a> and <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/selectors4/#future-pseudo">:future</a> pseudo-classes sometimes match <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-16">WebVTT
 Node Objects</a>. <a data-link-type="biblio" href="#biblio-selectors4">[SELECTORS4]</a></p>
    <p>The <dfn data-dfn-type="dfn" data-noexport="" id="past">:past<a class="self-link" href="#past"></a></dfn> pseudo-class only matches <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-17">WebVTT Node Objects</a> that are <i>in the past</i>.</p>
    <p class="algorithm" data-algorithm="in the past">A <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-18">WebVTT Node Object</a> <var>c</var> is <dfn data-dfn-type="dfn" data-noexport="" id="in-the-past">in the past<a class="self-link" href="#in-the-past"></a></dfn> if, in a
-pre-order, depth-first traversal of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-29">WebVTT cue</a>’s <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-33">list of WebVTT Node Objects</a>,
+pre-order, depth-first traversal of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-33">WebVTT cue</a>’s <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-33">list of WebVTT Node Objects</a>,
 there exists a <a data-link-type="dfn" href="#webvtt-timestamp-object" id="ref-for-webvtt-timestamp-object-6">WebVTT Timestamp Object</a> whose value is less than the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#current-position">current playback
 position</a> of the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media element</a> that is the <i>matched element</i>, entirely after the <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-19">WebVTT Node Object</a> <var>c</var>.</p>
    <p>The <dfn data-dfn-type="dfn" data-noexport="" id="future">:future<a class="self-link" href="#future"></a></dfn> pseudo-class only matches <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-20">WebVTT Node
 Objects</a> that are <i>in the future</i>.</p>
    <p class="algorithm" data-algorithm="in the future">A <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-21">WebVTT Node Object</a> <var>c</var> is <dfn data-dfn-type="dfn" data-noexport="" id="in-the-future">in the future<a class="self-link" href="#in-the-future"></a></dfn> if, in a
-pre-order, depth-first traversal of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-30">WebVTT cue</a>’s <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-34">list of WebVTT Node Objects</a>,
+pre-order, depth-first traversal of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-34">WebVTT cue</a>’s <a data-link-type="dfn" href="#list-of-webvtt-node-objects" id="ref-for-list-of-webvtt-node-objects-34">list of WebVTT Node Objects</a>,
 there exists a <a data-link-type="dfn" href="#webvtt-timestamp-object" id="ref-for-webvtt-timestamp-object-7">WebVTT Timestamp Object</a> whose value is greater than the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#current-position">current playback
 position</a> of the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#media-element">media element</a> that is the <i>matched element</i>, entirely before the <a data-link-type="dfn" href="#webvtt-node-object" id="ref-for-webvtt-node-object-22">WebVTT Node Object</a> <var>c</var>.</p>
-   <h4 class="heading settled" data-level="7.2.3" id="the-cue-region-pseudo-element"><span class="secno">7.2.3. </span><span class="content">The <span class="css">::cue-region</span> pseudo-element</span><a class="self-link" href="#the-cue-region-pseudo-element"></a></h4>
+   <h4 class="heading settled" data-level="8.2.3" id="the-cue-region-pseudo-element"><span class="secno">8.2.3. </span><span class="content">The <span class="css">::cue-region</span> pseudo-element</span><a class="self-link" href="#the-cue-region-pseudo-element"></a></h4>
    <p>Pseudo-elements apply to elements that are matched by selectors. For the purpose of this section,
 that element is the matched element. The pseudo-element defined below affects the styling of text
 track regions that are being rendered for the matched element.</p>
@@ -5192,12 +5474,12 @@
    <p>When a user agent is rendering one or more text track regions according to the <a data-link-type="dfn" href="#rules-for-updating-the-display-of-webvtt-text-tracks" id="ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-9">rules for
 updating the display of WebVTT text tracks</a>, <a data-link-type="dfn" href="#webvtt-region-object" id="ref-for-webvtt-region-object-15">WebVTT region
 objects</a> used in the rendering can be matched by the above pseudo-element. User agents that
-support the pseudo-element must dynamically update renderings accordingly. When either <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#white-space">white-space</a> or one of the properties corresponding to the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-fonts-3/#propdef-font">font</a> shorthand (including <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/CSS22/visudet.html#propdef-line-height">line-height</a>) changes
-value, then the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-cue-display-state">text track cue display state</a> of all the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-31">WebVTT cues</a> in
+support the pseudo-element must dynamically update renderings accordingly. When either <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-text-3/#propdef-white-space">white-space</a> or one of the properties corresponding to the <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/css-fonts-3/#propdef-font">font</a> shorthand (including <a class="property" data-link-type="propdesc" href="https://www.w3.org/TR/CSS22/visudet.html#propdef-line-height">line-height</a>) changes
+value, then the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-cue-display-state">text track cue display state</a> of all the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-35">WebVTT cues</a> in
 the region must be emptied and the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-tracks">text track</a>’s <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#rules-for-updating-the-text-track-rendering">rules for updating the text track
 rendering</a> must be immediately rerun.</p>
-   <h2 class="heading settled" data-level="8" id="api"><span class="secno">8. </span><span class="content">API</span><a class="self-link" href="#api"></a></h2>
-   <h3 class="heading settled algorithm" data-algorithm="The VTTCue interface" data-level="8.1" id="the-vttcue-interface"><span class="secno">8.1. </span><span class="content">The <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-2">VTTCue</a></code> interface</span><a class="self-link" href="#the-vttcue-interface"></a></h3>
+   <h2 class="heading settled" data-level="9" id="api"><span class="secno">9. </span><span class="content">API</span><a class="self-link" href="#api"></a></h2>
+   <h3 class="heading settled algorithm" data-algorithm="The VTTCue interface" data-level="9.1" id="the-vttcue-interface"><span class="secno">9.1. </span><span class="content">The <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-2">VTTCue</a></code> interface</span><a class="self-link" href="#the-vttcue-interface"></a></h3>
    <p>The following interface is used to expose WebVTT cues in the DOM API:</p>
 <pre class="idl highlight def"><span class="kt">enum</span> <dfn class="nv dfn-paneled idl-code" data-dfn-type="enum" data-export="" id="enumdef-autokeyword"><code>AutoKeyword</code></dfn> { <dfn class="s idl-code" data-dfn-for="AutoKeyword" data-dfn-type="enum-value" data-export="" data-lt="&quot;auto&quot;|auto" id="dom-autokeyword-auto"><code>"auto"</code><a class="self-link" href="#dom-autokeyword-auto"></a></dfn> };
 <span class="kt">typedef</span> (<a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-double"><span class="kt">double</span></a> <span class="kt">or</span> <a class="n" data-link-type="idl-name" href="#enumdef-autokeyword" id="ref-for-enumdef-autokeyword-1">AutoKeyword</a>) <dfn class="nv dfn-paneled idl-code" data-dfn-type="typedef" data-export="" id="typedefdef-lineandpositionsetting"><code>LineAndPositionSetting</code></dfn>;
@@ -5205,7 +5487,8 @@
 <span class="kt">enum</span> <dfn class="nv dfn-paneled idl-code" data-dfn-type="enum" data-export="" id="enumdef-linealignsetting"><code>LineAlignSetting</code></dfn> { <dfn class="s idl-code" data-dfn-for="LineAlignSetting" data-dfn-type="enum-value" data-export="" data-lt="&quot;start&quot;|start" id="dom-linealignsetting-start"><code>"start"</code><a class="self-link" href="#dom-linealignsetting-start"></a></dfn>, <dfn class="s idl-code" data-dfn-for="LineAlignSetting" data-dfn-type="enum-value" data-export="" data-lt="&quot;center&quot;|center" id="dom-linealignsetting-center"><code>"center"</code><a class="self-link" href="#dom-linealignsetting-center"></a></dfn>, <dfn class="s idl-code" data-dfn-for="LineAlignSetting" data-dfn-type="enum-value" data-export="" data-lt="&quot;end&quot;|end" id="dom-linealignsetting-end"><code>"end"</code><a class="self-link" href="#dom-linealignsetting-end"></a></dfn> };
 <span class="kt">enum</span> <dfn class="nv dfn-paneled idl-code" data-dfn-type="enum" data-export="" id="enumdef-positionalignsetting"><code>PositionAlignSetting</code></dfn> { <dfn class="s idl-code" data-dfn-for="PositionAlignSetting" data-dfn-type="enum-value" data-export="" data-lt="&quot;line-left&quot;|line-left" id="dom-positionalignsetting-line-left"><code>"line-left"</code><a class="self-link" href="#dom-positionalignsetting-line-left"></a></dfn>, <dfn class="s idl-code" data-dfn-for="PositionAlignSetting" data-dfn-type="enum-value" data-export="" data-lt="&quot;center&quot;|center" id="dom-positionalignsetting-center"><code>"center"</code><a class="self-link" href="#dom-positionalignsetting-center"></a></dfn>, <dfn class="s idl-code" data-dfn-for="PositionAlignSetting" data-dfn-type="enum-value" data-export="" data-lt="&quot;line-right&quot;|line-right" id="dom-positionalignsetting-line-right"><code>"line-right"</code><a class="self-link" href="#dom-positionalignsetting-line-right"></a></dfn>, <dfn class="s idl-code" data-dfn-for="PositionAlignSetting" data-dfn-type="enum-value" data-export="" data-lt="&quot;auto&quot;|auto" id="dom-positionalignsetting-auto"><code>"auto"</code><a class="self-link" href="#dom-positionalignsetting-auto"></a></dfn> };
 <span class="kt">enum</span> <dfn class="nv dfn-paneled idl-code" data-dfn-type="enum" data-export="" id="enumdef-alignsetting"><code>AlignSetting</code></dfn> { <dfn class="s idl-code" data-dfn-for="AlignSetting" data-dfn-type="enum-value" data-export="" data-lt="&quot;start&quot;|start" id="dom-alignsetting-start"><code>"start"</code><a class="self-link" href="#dom-alignsetting-start"></a></dfn>, <dfn class="s idl-code" data-dfn-for="AlignSetting" data-dfn-type="enum-value" data-export="" data-lt="&quot;center&quot;|center" id="dom-alignsetting-center"><code>"center"</code><a class="self-link" href="#dom-alignsetting-center"></a></dfn>, <dfn class="s idl-code" data-dfn-for="AlignSetting" data-dfn-type="enum-value" data-export="" data-lt="&quot;end&quot;|end" id="dom-alignsetting-end"><code>"end"</code><a class="self-link" href="#dom-alignsetting-end"></a></dfn>, <dfn class="s idl-code" data-dfn-for="AlignSetting" data-dfn-type="enum-value" data-export="" data-lt="&quot;left&quot;|left" id="dom-alignsetting-left"><code>"left"</code><a class="self-link" href="#dom-alignsetting-left"></a></dfn>, <dfn class="s idl-code" data-dfn-for="AlignSetting" data-dfn-type="enum-value" data-export="" data-lt="&quot;right&quot;|right" id="dom-alignsetting-right"><code>"right"</code><a class="self-link" href="#dom-alignsetting-right"></a></dfn> };
-[<a class="nv idl-code" data-link-type="constructor" href="#dom-vttcue-vttcue" id="ref-for-dom-vttcue-vttcue-1">Constructor</a>(<a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-double"><span class="kt">double</span></a> <dfn class="nv idl-code" data-dfn-for="VTTCue/VTTCue(startTime, endTime, text)" data-dfn-type="argument" data-export="" id="dom-vttcue-vttcue-starttime-endtime-text-starttime"><code>startTime</code><a class="self-link" href="#dom-vttcue-vttcue-starttime-endtime-text-starttime"></a></dfn>, <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-double"><span class="kt">double</span></a> <dfn class="nv idl-code" data-dfn-for="VTTCue/VTTCue(startTime, endTime, text)" data-dfn-type="argument" data-export="" id="dom-vttcue-vttcue-starttime-endtime-text-endtime"><code>endTime</code><a class="self-link" href="#dom-vttcue-vttcue-starttime-endtime-text-endtime"></a></dfn>, <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-DOMString"><span class="kt">DOMString</span></a> <dfn class="nv idl-code" data-dfn-for="VTTCue/VTTCue(startTime, endTime, text)" data-dfn-type="argument" data-export="" id="dom-vttcue-vttcue-starttime-endtime-text-text"><code>text</code><a class="self-link" href="#dom-vttcue-vttcue-starttime-endtime-text-text"></a></dfn>)]
+[<a class="nv idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed">Exposed</a>=<span class="n">Window</span>,
+ <a class="nv idl-code" data-link-type="constructor" href="#dom-vttcue-vttcue" id="ref-for-dom-vttcue-vttcue-1">Constructor</a>(<a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-double"><span class="kt">double</span></a> <dfn class="nv idl-code" data-dfn-for="VTTCue/VTTCue(startTime, endTime, text)" data-dfn-type="argument" data-export="" id="dom-vttcue-vttcue-starttime-endtime-text-starttime"><code>startTime</code><a class="self-link" href="#dom-vttcue-vttcue-starttime-endtime-text-starttime"></a></dfn>, <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-double"><span class="kt">double</span></a> <dfn class="nv idl-code" data-dfn-for="VTTCue/VTTCue(startTime, endTime, text)" data-dfn-type="argument" data-export="" id="dom-vttcue-vttcue-starttime-endtime-text-endtime"><code>endTime</code><a class="self-link" href="#dom-vttcue-vttcue-starttime-endtime-text-endtime"></a></dfn>, <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-DOMString"><span class="kt">DOMString</span></a> <dfn class="nv idl-code" data-dfn-for="VTTCue/VTTCue(startTime, endTime, text)" data-dfn-type="argument" data-export="" id="dom-vttcue-vttcue-starttime-endtime-text-text"><code>text</code><a class="self-link" href="#dom-vttcue-vttcue-starttime-endtime-text-text"></a></dfn>)]
 <span class="kt">interface</span> <dfn class="nv dfn-paneled idl-code" data-dfn-type="interface" data-export="" id="vttcue"><code>VTTCue</code></dfn> : <a class="n" data-link-type="idl-name" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#texttrackcue-texttrackcue">TextTrackCue</a> {
   <span class="kt">attribute</span> <a class="n" data-link-type="idl-name" href="#vttregion" id="ref-for-vttregion-1">VTTRegion</a>? <a class="nv idl-code" data-link-type="attribute" data-type="VTTRegion?" href="#dom-vttcue-region" id="ref-for-dom-vttcue-region-1">region</a>;
   <span class="kt">attribute</span> <a class="n" data-link-type="idl-name" href="#enumdef-directionsetting" id="ref-for-enumdef-directionsetting-1">DirectionSetting</a> <a class="nv idl-code" data-link-type="attribute" data-type="DirectionSetting" href="#dom-vttcue-vertical" id="ref-for-dom-vttcue-vertical-1">vertical</a>;
@@ -5226,23 +5509,23 @@
      <p>Returns a new <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-3">VTTCue</a></code> object, for use with the <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#dom-texttrack-addcue">addCue()</a></code> method.</p>
      <p>The <var>startTime</var> argument sets the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-cue-start-time">text track cue start time</a>.</p>
      <p>The <var>endTime</var> argument sets the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-cue-end-time">text track cue end time</a>.</p>
-     <p>The <var>text</var> argument sets the <a data-link-type="dfn" href="#text-track-cue-text" id="ref-for-text-track-cue-text-7">text track cue text</a>.</p>
+     <p>The <var>text</var> argument sets the <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-14">cue text</a>.</p>
     <dt><var>cue</var> . <code class="idl"><a data-link-type="idl" href="#dom-vttcue-region" id="ref-for-dom-vttcue-region-2">region</a></code>
     <dd>
      <p>Returns the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-2">VTTRegion</a></code> object to which this cue belongs, if any, or null otherwise.</p>
      <p>Can be set.</p>
     <dt><var>cue</var> . <code class="idl"><a data-link-type="idl" href="#dom-vttcue-vertical" id="ref-for-dom-vttcue-vertical-2">vertical</a></code> [ = <var>value</var> ]
     <dd>
-     <p>Returns a string representing the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-35">WebVTT cue writing direction</a>, as follows:</p>
+     <p>Returns a string representing the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-34">WebVTT cue writing direction</a>, as follows:</p>
      <dl class="switch">
       <dt>If it is <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-22">horizontal</a>
       <dd>
        <p>The empty string.</p>
-      <dt>If it is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-left-writing-direction" id="ref-for-webvtt-cue-vertical-growing-left-writing-direction-13">vertical growing
+      <dt>If it is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-left-writing-direction" id="ref-for-webvtt-cue-vertical-growing-left-writing-direction-12">vertical growing
    left</a>
       <dd>
        <p>The string "<code>rl</code>".</p>
-      <dt>If it is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-13">vertical growing
+      <dt>If it is <a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-12">vertical growing
    right</a>
       <dd>
        <p>The string "<code>lr</code>".</p>
@@ -5250,11 +5533,11 @@
      <p>Can be set.</p>
     <dt><var>cue</var> . <code class="idl"><a data-link-type="idl" href="#dom-vttcue-snaptolines" id="ref-for-dom-vttcue-snaptolines-3">snapToLines</a></code> [ = <var>value</var> ]
     <dd>
-     <p>Returns true if the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-16">WebVTT cue snap-to-lines flag</a> is true, false otherwise.</p>
+     <p>Returns true if the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-14">WebVTT cue snap-to-lines flag</a> is true, false otherwise.</p>
      <p>Can be set.</p>
     <dt><var>cue</var> . <code class="idl"><a data-link-type="idl" href="#dom-vttcue-line" id="ref-for-dom-vttcue-line-3">line</a></code> [ = <var>value</var> ]
     <dd>
-     <p>Returns the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-23">WebVTT cue line</a>. In the case of the value being <a data-link-type="dfn" href="#webvtt-cue-line-automatic" id="ref-for-webvtt-cue-line-automatic-5">auto</a>, the string "<code>auto</code>" is returned.</p>
+     <p>Returns the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-24">WebVTT cue line</a>. In the case of the value being <a data-link-type="dfn" href="#webvtt-cue-line-automatic" id="ref-for-webvtt-cue-line-automatic-6">auto</a>, the string "<code>auto</code>" is returned.</p>
      <p>Can be set.</p>
     <dt><var>cue</var> . <code class="idl"><a data-link-type="idl" href="#dom-vttcue-linealign" id="ref-for-dom-vttcue-linealign-2">lineAlign</a></code> [ = <var>value</var> ]
     <dd>
@@ -5279,13 +5562,13 @@
     <dd>
      <p>Returns a string representing the <a data-link-type="dfn" href="#webvtt-cue-position-alignment" id="ref-for-webvtt-cue-position-alignment-11">WebVTT cue position alignment</a>, as follows:</p>
      <dl class="switch">
-      <dt>If it is <a data-link-type="dfn" href="#webvtt-cue-position-line-left-alignment" id="ref-for-webvtt-cue-position-line-left-alignment-8">line-left alignment</a>
+      <dt>If it is <a data-link-type="dfn" href="#webvtt-cue-position-line-left-alignment" id="ref-for-webvtt-cue-position-line-left-alignment-10">line-left alignment</a>
       <dd>
        <p>The string "<code>line-left</code>".</p>
       <dt>If it is <a data-link-type="dfn" href="#webvtt-cue-position-center-alignment" id="ref-for-webvtt-cue-position-center-alignment-8">center alignment</a>
       <dd>
        <p>The string "<code>center</code>".</p>
-      <dt>If it is <a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-8">line-right alignment</a>
+      <dt>If it is <a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-10">line-right alignment</a>
       <dd>
        <p>The string "<code>line-right</code>".</p>
       <dt>If it is <a data-link-type="dfn" href="#webvtt-cue-position-automatic-alignment" id="ref-for-webvtt-cue-position-automatic-alignment-4">automatic alignment</a>
@@ -5295,19 +5578,19 @@
      <p>Can be set.</p>
     <dt><var>cue</var> . <code class="idl"><a data-link-type="idl" href="#dom-vttcue-size" id="ref-for-dom-vttcue-size-2">size</a></code> [ = <var>value</var> ]
     <dd>
-     <p>Returns the <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-11">WebVTT cue size</a>.</p>
+     <p>Returns the <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-12">WebVTT cue size</a>.</p>
      <p>Can be set.</p>
     <dt><var>cue</var> . <code class="idl"><a data-link-type="idl" href="#dom-vttcue-align" id="ref-for-dom-vttcue-align-2">align</a></code> [ = <var>value</var> ]
     <dd>
-     <p>Returns a string representing the <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-21">WebVTT cue text alignment</a>, as follows:</p>
+     <p>Returns a string representing the <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-23">WebVTT cue text alignment</a>, as follows:</p>
      <dl class="switch">
-      <dt>If it is <a data-link-type="dfn" href="#webvtt-cue-start-alignment" id="ref-for-webvtt-cue-start-alignment-8">start alignment</a>
+      <dt>If it is <a data-link-type="dfn" href="#webvtt-cue-start-alignment" id="ref-for-webvtt-cue-start-alignment-9">start alignment</a>
       <dd>
        <p>The string "<code>start</code>".</p>
       <dt>If it is <a data-link-type="dfn" href="#webvtt-cue-center-alignment" id="ref-for-webvtt-cue-center-alignment-8">center alignment</a>
       <dd>
        <p>The string "<code>center</code>".</p>
-      <dt>If it is <a data-link-type="dfn" href="#webvtt-cue-end-alignment" id="ref-for-webvtt-cue-end-alignment-7">end alignment</a>
+      <dt>If it is <a data-link-type="dfn" href="#webvtt-cue-end-alignment" id="ref-for-webvtt-cue-end-alignment-8">end alignment</a>
       <dd>
        <p>The string "<code>end</code>".</p>
       <dt>If it is <a data-link-type="dfn" href="#webvtt-cue-left-alignment" id="ref-for-webvtt-cue-left-alignment-7">left alignment</a>
@@ -5320,17 +5603,17 @@
      <p>Can be set.</p>
     <dt><var>cue</var> . <code class="idl"><a data-link-type="idl" href="#dom-vttcue-text" id="ref-for-dom-vttcue-text-2">text</a></code> [ = <var>value</var> ]
     <dd>
-     <p>Returns the <a data-link-type="dfn" href="#text-track-cue-text" id="ref-for-text-track-cue-text-8">text track cue text</a> in raw unparsed form.</p>
+     <p>Returns the <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-15">cue text</a> in raw unparsed form.</p>
      <p>Can be set.</p>
     <dt><var>fragment</var> = <var>cue</var> . <a class="idl-code" data-link-type="method" href="#dom-vttcue-getcueashtml" id="ref-for-dom-vttcue-getcueashtml-3">getCueAsHTML</a>()
     <dd>
-     <p>Returns the <a data-link-type="dfn" href="#text-track-cue-text" id="ref-for-text-track-cue-text-9">text track cue text</a> as a <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/dom/#documentfragment">DocumentFragment</a></code> of <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#html-element">HTML elements</a> and
-  other DOM nodes.</p>
+     <p>Returns the <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-16">cue text</a> as a <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/dom/#documentfragment">DocumentFragment</a></code> of <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#html-element">HTML elements</a> and other DOM
+  nodes.</p>
    </dl>
    <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTCue" data-dfn-type="constructor" data-export="" data-lt="VTTCue(startTime, endTime, text)" id="dom-vttcue-vttcue"><code>VTTCue(<var>startTime</var>, <var>endTime</var>, <var>text</var>)</code></dfn> constructor, when invoked, must run the following steps:</p>
-   <ol class="algorithm">
+   <ol class="algorithm" data-algorithm="VTTCue construction">
     <li>
-     <p>Create a new <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-32">WebVTT cue</a>. Let <var>cue</var> be that <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-33">WebVTT cue</a>.</p>
+     <p>Create a new <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-36">WebVTT cue</a>. Let <var>cue</var> be that <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-37">WebVTT cue</a>.</p>
     <li>
      <p>Let <var>cue</var>’s <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-cue-start-time">text track cue start time</a> be the value of the <var>startTime</var> argument,
  interpreted as a time in seconds.</p>
@@ -5338,20 +5621,21 @@
      <p>Let <var>cue</var>’s <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-cue-end-time">text track cue end time</a> be the value of the <var>endTime</var> argument,
  interpreted as a time in seconds.</p>
     <li>
-     <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#text-track-cue-text" id="ref-for-text-track-cue-text-10">text track cue text</a> be the value of the <var>text</var> argument, and let the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-rules-for-extracting-the-chapter-title">rules for extracting the chapter title</a> be the <a data-link-type="dfn" href="#webvtt-rules-for-extracting-the-chapter-title" id="ref-for-webvtt-rules-for-extracting-the-chapter-title-1">WebVTT rules for extracting the chapter
+     <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-17">cue text</a> be the value of the <var>text</var> argument, and let the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-rules-for-extracting-the-chapter-title">rules for
+ extracting the chapter title</a> be the <a data-link-type="dfn" href="#webvtt-rules-for-extracting-the-chapter-title" id="ref-for-webvtt-rules-for-extracting-the-chapter-title-1">WebVTT rules for extracting the chapter
  title</a>.</p>
     <li>
      <p>Let <var>cue</var>’s <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#text-track-cue-identifier">text track cue identifier</a> be the empty string.</p>
     <li>
      <p>Let <var>cue</var>’s <a data-link-type="dfn" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#pause-on-exit-flag">text track cue pause-on-exit flag</a> be false.</p>
     <li>
-     <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-7">WebVTT cue region</a> be null.</p>
+     <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-10">WebVTT cue region</a> be null.</p>
     <li>
-     <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-36">WebVTT cue writing direction</a> be <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-23">horizontal</a>.</p>
+     <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-35">WebVTT cue writing direction</a> be <a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-23">horizontal</a>.</p>
     <li>
-     <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-17">WebVTT cue snap-to-lines flag</a> be true.</p>
+     <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-15">WebVTT cue snap-to-lines flag</a> be true.</p>
     <li>
-     <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-24">WebVTT cue line</a> be <a data-link-type="dfn" href="#webvtt-cue-line-automatic" id="ref-for-webvtt-cue-line-automatic-6">auto</a>.</p>
+     <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-25">WebVTT cue line</a> be <a data-link-type="dfn" href="#webvtt-cue-line-automatic" id="ref-for-webvtt-cue-line-automatic-7">auto</a>.</p>
     <li>
      <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-line-alignment" id="ref-for-webvtt-cue-line-alignment-15">WebVTT cue line alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-line-start-alignment" id="ref-for-webvtt-cue-line-start-alignment-7">start alignment</a>.</p>
     <li>
@@ -5359,50 +5643,50 @@
     <li>
      <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-position-alignment" id="ref-for-webvtt-cue-position-alignment-12">WebVTT cue position alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-position-automatic-alignment" id="ref-for-webvtt-cue-position-automatic-alignment-5">auto</a>.</p>
     <li>
-     <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-12">WebVTT cue size</a> be 100.</p>
+     <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-13">WebVTT cue size</a> be 100.</p>
     <li>
-     <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-22">WebVTT cue text alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-center-alignment" id="ref-for-webvtt-cue-center-alignment-9">center
+     <p>Let <var>cue</var>’s <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-24">WebVTT cue text alignment</a> be <a data-link-type="dfn" href="#webvtt-cue-center-alignment" id="ref-for-webvtt-cue-center-alignment-9">center
  alignment</a>.</p>
     <li>
      <p>Return the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-4">VTTCue</a></code> object representing <var>cue</var>.</p>
    </ol>
-   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTCue" data-dfn-type="attribute" data-export="" id="dom-vttcue-region"><code>region</code></dfn> attribute, on getting, must return the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-3">VTTRegion</a></code> object representing the <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-8">WebVTT cue region</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-34">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-5">VTTCue</a></code> object
-represents, if any; or null otherwise. On setting, the <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-9">WebVTT cue region</a> must be set to the
+   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTCue" data-dfn-type="attribute" data-export="" id="dom-vttcue-region"><code>region</code></dfn> attribute, on getting, must return the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-3">VTTRegion</a></code> object representing the <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-11">WebVTT cue region</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-38">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-5">VTTCue</a></code> object
+represents, if any; or null otherwise. On setting, the <a data-link-type="dfn" href="#webvtt-cue-region" id="ref-for-webvtt-cue-region-12">WebVTT cue region</a> must be set to the
 new value.</p>
    <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTCue" data-dfn-type="attribute" data-export="" id="dom-vttcue-vertical"><code>vertical</code></dfn> attribute, on getting, must return the string from
-the second cell of the row in the table below whose first cell is the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-37">WebVTT cue writing
-direction</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-35">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-6">VTTCue</a></code> object represents:</p>
+the second cell of the row in the table below whose first cell is the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-36">WebVTT cue writing
+direction</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-39">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-6">VTTCue</a></code> object represents:</p>
    <table class="complex data">
     <thead>
      <tr>
-      <th><a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-38">WebVTT cue writing direction</a>
+      <th><a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-37">WebVTT cue writing direction</a>
       <th><code class="idl"><a data-link-type="idl" href="#dom-vttcue-vertical" id="ref-for-dom-vttcue-vertical-3">vertical</a></code> value
     <tbody>
      <tr>
       <td><a data-link-type="dfn" href="#webvtt-cue-horizontal-writing-direction" id="ref-for-webvtt-cue-horizontal-writing-direction-24">Horizontal</a>
       <td>"<code></code>" (the empty string)
      <tr>
-      <td><a data-link-type="dfn" href="#webvtt-cue-vertical-growing-left-writing-direction" id="ref-for-webvtt-cue-vertical-growing-left-writing-direction-14">Vertical growing left</a>
+      <td><a data-link-type="dfn" href="#webvtt-cue-vertical-growing-left-writing-direction" id="ref-for-webvtt-cue-vertical-growing-left-writing-direction-13">Vertical growing left</a>
       <td>"<code>rl</code>"
      <tr>
-      <td><a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-14">Vertical growing right</a>
+      <td><a data-link-type="dfn" href="#webvtt-cue-vertical-growing-right-writing-direction" id="ref-for-webvtt-cue-vertical-growing-right-writing-direction-13">Vertical growing right</a>
       <td>"<code>lr</code>"
    </table>
-   <p>On setting, the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-39">WebVTT cue writing direction</a> must be set to the value given in the first
+   <p>On setting, the <a data-link-type="dfn" href="#webvtt-cue-writing-direction" id="ref-for-webvtt-cue-writing-direction-38">WebVTT cue writing direction</a> must be set to the value given in the first
 cell of the row in the table above whose second cell is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#case-sensitive">case-sensitive</a> match for the new
 value.</p>
-   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTCue" data-dfn-type="attribute" data-export="" id="dom-vttcue-snaptolines"><code>snapToLines</code></dfn> attribute, on getting, must return true if the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-18">WebVTT cue snap-to-lines flag</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-36">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-7">VTTCue</a></code> object represents
-is true; or false otherwise. On setting, the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-19">WebVTT cue snap-to-lines flag</a> must be set to the
+   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTCue" data-dfn-type="attribute" data-export="" id="dom-vttcue-snaptolines"><code>snapToLines</code></dfn> attribute, on getting, must return true if the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-16">WebVTT cue snap-to-lines flag</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-40">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-7">VTTCue</a></code> object represents
+is true; or false otherwise. On setting, the <a data-link-type="dfn" href="#webvtt-cue-snap-to-lines-flag" id="ref-for-webvtt-cue-snap-to-lines-flag-17">WebVTT cue snap-to-lines flag</a> must be set to the
 new value.</p>
-   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTCue" data-dfn-type="attribute" data-export="" id="dom-vttcue-line"><code>line</code></dfn> attribute, on getting, must return the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-25">WebVTT cue
-line</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-37">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-8">VTTCue</a></code> object represents. The special value <a data-link-type="dfn" href="#webvtt-cue-line-automatic" id="ref-for-webvtt-cue-line-automatic-7">auto</a> must be represented as the string "<code>auto</code>". On
-setting, the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-26">WebVTT cue line</a> must be set to the new value; if the new value is the string
-"<code>auto</code>", then it must be interpreted as the special value <a data-link-type="dfn" href="#webvtt-cue-line-automatic" id="ref-for-webvtt-cue-line-automatic-8">auto</a>.</p>
+   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTCue" data-dfn-type="attribute" data-export="" id="dom-vttcue-line"><code>line</code></dfn> attribute, on getting, must return the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-26">WebVTT cue
+line</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-41">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-8">VTTCue</a></code> object represents. The special value <a data-link-type="dfn" href="#webvtt-cue-line-automatic" id="ref-for-webvtt-cue-line-automatic-8">auto</a> must be represented as the string "<code>auto</code>". On
+setting, the <a data-link-type="dfn" href="#webvtt-cue-line" id="ref-for-webvtt-cue-line-27">WebVTT cue line</a> must be set to the new value; if the new value is the string
+"<code>auto</code>", then it must be interpreted as the special value <a data-link-type="dfn" href="#webvtt-cue-line-automatic" id="ref-for-webvtt-cue-line-automatic-9">auto</a>.</p>
    <p class="note" role="note">In order to be able to set the <code class="idl"><a data-link-type="idl" href="#dom-vttcue-snaptolines" id="ref-for-dom-vttcue-snaptolines-4">snapToLines</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-vttcue-line" id="ref-for-dom-vttcue-line-4">line</a></code> attributes
 in any order, the API does not reject setting <code class="idl"><a data-link-type="idl" href="#dom-vttcue-snaptolines" id="ref-for-dom-vttcue-snaptolines-5">snapToLines</a></code> to false when <code class="idl"><a data-link-type="idl" href="#dom-vttcue-line" id="ref-for-dom-vttcue-line-5">line</a></code> has a value outside the range 0..100, or vice versa.</p>
    <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTCue" data-dfn-type="attribute" data-export="" id="dom-vttcue-linealign"><code>lineAlign</code></dfn> attribute, on getting, must return the string from
 the second cell of the row in the table below whose first cell is the <a data-link-type="dfn" href="#webvtt-cue-line-alignment" id="ref-for-webvtt-cue-line-alignment-16">WebVTT cue line
-alignment</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-38">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-9">VTTCue</a></code> object represents:</p>
+alignment</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-42">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-9">VTTCue</a></code> object represents:</p>
    <table class="complex data">
     <thead>
      <tr>
@@ -5423,13 +5707,13 @@
 of the row in the table above whose second cell is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#case-sensitive">case-sensitive</a> match for the new
 value.</p>
    <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTCue" data-dfn-type="attribute" data-export="" id="dom-vttcue-position"><code>position</code></dfn> attribute, on getting, must return the <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-25">WebVTT cue
-position</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-39">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-10">VTTCue</a></code> object represents. The special value <a data-link-type="dfn" href="#webvtt-cue-automatic-position" id="ref-for-webvtt-cue-automatic-position-10">auto</a> must be represented as the string "<code>auto</code>".
+position</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-43">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-10">VTTCue</a></code> object represents. The special value <a data-link-type="dfn" href="#webvtt-cue-automatic-position" id="ref-for-webvtt-cue-automatic-position-10">auto</a> must be represented as the string "<code>auto</code>".
 On setting, if the new value is negative or greater than 100, then an <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/WebIDL-1/#indexsizeerror">IndexSizeError</a></code> exception
 must be thrown. Otherwise, the <a data-link-type="dfn" href="#webvtt-cue-position" id="ref-for-webvtt-cue-position-26">WebVTT cue position</a> must be set to the new value; if the new
 value is the string "<code>auto</code>", then it must be interpreted as the special value <a data-link-type="dfn" href="#webvtt-cue-automatic-position" id="ref-for-webvtt-cue-automatic-position-11">auto</a>.</p>
    <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTCue" data-dfn-type="attribute" data-export="" id="dom-vttcue-positionalign"><code>positionAlign</code></dfn> attribute, on getting, must return the string
 from the second cell of the row in the table below whose first cell is the <a data-link-type="dfn" href="#webvtt-cue-position-alignment" id="ref-for-webvtt-cue-position-alignment-13">WebVTT cue position
-alignment</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-40">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-11">VTTCue</a></code> object represents:</p>
+alignment</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-44">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-11">VTTCue</a></code> object represents:</p>
    <table class="complex data">
     <thead>
      <tr>
@@ -5437,13 +5721,13 @@
       <th><code class="idl"><a data-link-type="idl" href="#dom-vttcue-positionalign" id="ref-for-dom-vttcue-positionalign-3">positionAlign</a></code> value
     <tbody>
      <tr>
-      <td><a data-link-type="dfn" href="#webvtt-cue-position-line-left-alignment" id="ref-for-webvtt-cue-position-line-left-alignment-9">Line-left alignment</a>
+      <td><a data-link-type="dfn" href="#webvtt-cue-position-line-left-alignment" id="ref-for-webvtt-cue-position-line-left-alignment-11">Line-left alignment</a>
       <td>"<code>line-left</code>"
      <tr>
       <td><a data-link-type="dfn" href="#webvtt-cue-position-center-alignment" id="ref-for-webvtt-cue-position-center-alignment-9">Center alignment</a>
       <td>"<code>center</code>"
      <tr>
-      <td><a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-9">Line-right alignment</a>
+      <td><a data-link-type="dfn" href="#webvtt-cue-position-line-right-alignment" id="ref-for-webvtt-cue-position-line-right-alignment-11">Line-right alignment</a>
       <td>"<code>line-right</code>"
      <tr>
       <td><a data-link-type="dfn" href="#webvtt-cue-position-automatic-alignment" id="ref-for-webvtt-cue-position-automatic-alignment-6">Automatic alignment</a>
@@ -5452,26 +5736,26 @@
    <p>On setting, the <a data-link-type="dfn" href="#webvtt-cue-position-alignment" id="ref-for-webvtt-cue-position-alignment-15">WebVTT cue position alignment</a> must be set to the value given in the first
 cell of the row in the table above whose second cell is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#case-sensitive">case-sensitive</a> match for the new
 value.</p>
-   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTCue" data-dfn-type="attribute" data-export="" id="dom-vttcue-size"><code>size</code></dfn> attribute, on getting, must return the <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-13">WebVTT cue
-size</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-41">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-12">VTTCue</a></code> object represents. On setting, if the new
+   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTCue" data-dfn-type="attribute" data-export="" id="dom-vttcue-size"><code>size</code></dfn> attribute, on getting, must return the <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-14">WebVTT cue
+size</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-45">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-12">VTTCue</a></code> object represents. On setting, if the new
 value is negative or greater than 100, then an <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/WebIDL-1/#indexsizeerror">IndexSizeError</a></code> exception must be thrown.
-Otherwise, the <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-14">WebVTT cue size</a> must be set to the new value.</p>
+Otherwise, the <a data-link-type="dfn" href="#webvtt-cue-size" id="ref-for-webvtt-cue-size-15">WebVTT cue size</a> must be set to the new value.</p>
    <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTCue" data-dfn-type="attribute" data-export="" id="dom-vttcue-align"><code>align</code></dfn> attribute, on getting, must return the string from the
-second cell of the row in the table below whose first cell is the <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-23">WebVTT cue text alignment</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-42">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-13">VTTCue</a></code> object represents:</p>
+second cell of the row in the table below whose first cell is the <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-25">WebVTT cue text alignment</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-46">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-13">VTTCue</a></code> object represents:</p>
    <table class="complex data">
     <thead>
      <tr>
-      <th><a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-24">WebVTT cue text alignment</a>
+      <th><a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-26">WebVTT cue text alignment</a>
       <th><code class="idl"><a data-link-type="idl" href="#dom-vttcue-align" id="ref-for-dom-vttcue-align-3">align</a></code> value
     <tbody>
      <tr>
-      <td><a data-link-type="dfn" href="#webvtt-cue-start-alignment" id="ref-for-webvtt-cue-start-alignment-9">Start alignment</a>
+      <td><a data-link-type="dfn" href="#webvtt-cue-start-alignment" id="ref-for-webvtt-cue-start-alignment-10">Start alignment</a>
       <td>"<code>start</code>"
      <tr>
       <td><a data-link-type="dfn" href="#webvtt-cue-center-alignment" id="ref-for-webvtt-cue-center-alignment-10">Center alignment</a>
       <td>"<code>center</code>"
      <tr>
-      <td><a data-link-type="dfn" href="#webvtt-cue-end-alignment" id="ref-for-webvtt-cue-end-alignment-8">End alignment</a>
+      <td><a data-link-type="dfn" href="#webvtt-cue-end-alignment" id="ref-for-webvtt-cue-end-alignment-9">End alignment</a>
       <td>"<code>end</code>"
      <tr>
       <td><a data-link-type="dfn" href="#webvtt-cue-left-alignment" id="ref-for-webvtt-cue-left-alignment-8">Left alignment</a>
@@ -5480,25 +5764,25 @@
       <td><a data-link-type="dfn" href="#webvtt-cue-right-alignment" id="ref-for-webvtt-cue-right-alignment-8">Right alignment</a>
       <td>"<code>right</code>"
    </table>
-   <p>On setting, the <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-25">WebVTT cue text alignment</a> must be set to the value given in the first cell
+   <p>On setting, the <a data-link-type="dfn" href="#webvtt-cue-text-alignment" id="ref-for-webvtt-cue-text-alignment-27">WebVTT cue text alignment</a> must be set to the value given in the first cell
 of the row in the table above whose second cell is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#case-sensitive">case-sensitive</a> match for the new
 value.</p>
-   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTCue" data-dfn-type="attribute" data-export="" id="dom-vttcue-text"><code>text</code></dfn> attribute, on getting, must return the raw <a data-link-type="dfn" href="#text-track-cue-text" id="ref-for-text-track-cue-text-11">text track
-cue text</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-43">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-14">VTTCue</a></code> object represents. On setting, the <a data-link-type="dfn" href="#text-track-cue-text" id="ref-for-text-track-cue-text-12">text
-track cue text</a> must be set to the new value.</p>
-   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTCue" data-dfn-type="method" data-export="" id="dom-vttcue-getcueashtml"><code>getCueAsHTML()</code></dfn> method must convert the <a data-link-type="dfn" href="#text-track-cue-text" id="ref-for-text-track-cue-text-13">text track cue
-text</a> to a <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/dom/#documentfragment">DocumentFragment</a></code> for the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/webappapis.html#responsible-document">responsible document</a> specified by the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/webappapis.html#entry-settings-object">entry
-settings object</a> by applying the <a data-link-type="dfn" href="#webvtt-cue-text-dom-construction-rules" id="ref-for-webvtt-cue-text-dom-construction-rules-1">WebVTT cue text DOM construction rules</a> to the result of
+   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTCue" data-dfn-type="attribute" data-export="" id="dom-vttcue-text"><code>text</code></dfn> attribute, on getting, must return the raw <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-18">cue
+text</a> of the <a data-link-type="dfn" href="#webvtt-cue" id="ref-for-webvtt-cue-47">WebVTT cue</a> that the <code class="idl"><a data-link-type="idl" href="#vttcue" id="ref-for-vttcue-14">VTTCue</a></code> object represents. On setting, the <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-19">cue
+text</a> must be set to the new value.</p>
+   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTCue" data-dfn-type="method" data-export="" id="dom-vttcue-getcueashtml"><code>getCueAsHTML()</code></dfn> method must convert the <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-20">cue text</a> to a <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/dom/#documentfragment">DocumentFragment</a></code> for the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/webappapis.html#responsible-document">responsible document</a> specified by the <a data-link-type="dfn" href="https://www.w3.org/TR/html51/webappapis.html#entry-settings-object">entry settings
+object</a> by applying the <a data-link-type="dfn" href="#webvtt-cue-text-dom-construction-rules" id="ref-for-webvtt-cue-text-dom-construction-rules-1">WebVTT cue text DOM construction rules</a> to the result of applying
+the <a data-link-type="dfn" href="#webvtt-cue-text-parsing-rules" id="ref-for-webvtt-cue-text-parsing-rules-3">WebVTT cue text parsing rules</a> to the <a data-link-type="dfn" href="#cue-text" id="ref-for-cue-text-21">cue text</a>.</p>
-applying the <a data-link-type="dfn" href="#webvtt-cue-text-parsing-rules" id="ref-for-webvtt-cue-text-parsing-rules-3">WebVTT cue text parsing rules</a> to the <a data-link-type="dfn" href="#text-track-cue-text" id="ref-for-text-track-cue-text-14">text track cue text</a>.</p>
    <p class="note" role="note">A fallback language is not provided for <code class="idl"><a data-link-type="idl" href="#dom-vttcue-getcueashtml" id="ref-for-dom-vttcue-getcueashtml-4">getCueAsHTML()</a></code> since a <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/dom/#documentfragment">DocumentFragment</a></code> cannot expose language information.</p>
-   <h3 class="heading settled algorithm" data-algorithm="The VTTRegion interface" data-level="8.2" id="the-vttregion-interface"><span class="secno">8.2. </span><span class="content">The <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-4">VTTRegion</a></code> interface</span><a class="self-link" href="#the-vttregion-interface"></a></h3>
+   <h3 class="heading settled algorithm" data-algorithm="The VTTRegion interface" data-level="9.2" id="the-vttregion-interface"><span class="secno">9.2. </span><span class="content">The <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-4">VTTRegion</a></code> interface</span><a class="self-link" href="#the-vttregion-interface"></a></h3>
    <p>The following interface is used to expose WebVTT regions in the DOM API:</p>
 <pre class="idl highlight def"><span class="kt">enum</span> <dfn class="nv dfn-paneled idl-code" data-dfn-type="enum" data-export="" id="enumdef-scrollsetting"><code>ScrollSetting</code></dfn> { <dfn class="s idl-code" data-dfn-for="ScrollSetting" data-dfn-type="enum-value" data-export="" data-lt="&quot;&quot;|" id="dom-scrollsetting"><code>""</code><a class="self-link" href="#dom-scrollsetting"></a></dfn> /* none */, <dfn class="s idl-code" data-dfn-for="ScrollSetting" data-dfn-type="enum-value" data-export="" data-lt="&quot;up&quot;|up" id="dom-scrollsetting-up"><code>"up"</code><a class="self-link" href="#dom-scrollsetting-up"></a></dfn> };
-[<a class="nv idl-code" data-link-type="constructor" href="#dom-vttregion-vttregion" id="ref-for-dom-vttregion-vttregion-1">Constructor</a>]
+[<a class="nv idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed">Exposed</a>=<span class="n">Window</span>,
+ <a class="nv idl-code" data-link-type="constructor" href="#dom-vttregion-vttregion" id="ref-for-dom-vttregion-vttregion-1">Constructor</a>]
 <span class="kt">interface</span> <dfn class="nv dfn-paneled idl-code" data-dfn-type="interface" data-export="" id="vttregion"><code>VTTRegion</code></dfn> {
   <span class="kt">attribute</span> <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-DOMString"><span class="kt">DOMString</span></a> <a class="nv idl-code" data-link-type="attribute" data-type="DOMString" href="#dom-vttregion-id" id="ref-for-dom-vttregion-id-1">id</a>;
   <span class="kt">attribute</span> <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-double"><span class="kt">double</span></a> <a class="nv idl-code" data-link-type="attribute" data-type="double" href="#dom-vttregion-width" id="ref-for-dom-vttregion-width-1">width</a>;
-  <span class="kt">attribute</span> <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-long"><span class="kt">long</span></a> <a class="nv idl-code" data-link-type="attribute" data-type="long" href="#dom-vttregion-lines" id="ref-for-dom-vttregion-lines-1">lines</a>;
+  <span class="kt">attribute</span> <a class="n idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><span class="kt">unsigned</span> <span class="kt">long</span></a> <a class="nv idl-code" data-link-type="attribute" data-type="unsigned long" href="#dom-vttregion-lines" id="ref-for-dom-vttregion-lines-1">lines</a>;
   <span class="kt">attribute</span> <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-double"><span class="kt">double</span></a> <a class="nv idl-code" data-link-type="attribute" data-type="double" href="#dom-vttregion-regionanchorx" id="ref-for-dom-vttregion-regionanchorx-1">regionAnchorX</a>;
   <span class="kt">attribute</span> <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-double"><span class="kt">double</span></a> <a class="nv idl-code" data-link-type="attribute" data-type="double" href="#dom-vttregion-regionanchory" id="ref-for-dom-vttregion-regionanchory-1">regionAnchorY</a>;
   <span class="kt">attribute</span> <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-double"><span class="kt">double</span></a> <a class="nv idl-code" data-link-type="attribute" data-type="double" href="#dom-vttregion-viewportanchorx" id="ref-for-dom-vttregion-viewportanchorx-1">viewportAnchorX</a>;
@@ -5550,9 +5834,9 @@
    </dl>
    <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTRegion" data-dfn-type="constructor" data-export="" id="dom-vttregion-vttregion"><code>VTTRegion()</code></dfn> constructor, when invoked, must run the
 following steps:</p>
-   <ol class="algorithm">
+   <ol class="algorithm" data-algorithm="VTTRegion construction">
     <li>
-     <p>Create a new <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-15">WebVTT region</a>. Let <var>region</var> be that <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-16">WebVTT region</a>.</p>
+     <p>Create a new <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-16">WebVTT region</a>. Let <var>region</var> be that <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-17">WebVTT region</a>.</p>
     <li>
      <p>Let <var>region</var>’s <a data-link-type="dfn" href="#webvtt-region-identifier" id="ref-for-webvtt-region-identifier-7">WebVTT region identifier</a> be the empty string.</p>
     <li>
@@ -5575,26 +5859,26 @@
      <p>Return the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-6">VTTRegion</a></code> object representing <var>region</var>.</p>
    </ol>
    <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTRegion" data-dfn-type="attribute" data-export="" id="dom-vttregion-id"><code>id</code></dfn> attribute, on getting, must return the <a data-link-type="dfn" href="#webvtt-region-identifier" id="ref-for-webvtt-region-identifier-8">WebVTT region
-identifier</a> of the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-17">WebVTT region</a> that the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-7">VTTRegion</a></code> object represents. On setting, the <a data-link-type="dfn" href="#webvtt-region-identifier" id="ref-for-webvtt-region-identifier-9">WebVTT region identifier</a> must be set to the new value.</p>
+identifier</a> of the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-18">WebVTT region</a> that the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-7">VTTRegion</a></code> object represents. On setting, the <a data-link-type="dfn" href="#webvtt-region-identifier" id="ref-for-webvtt-region-identifier-9">WebVTT region identifier</a> must be set to the new value.</p>
    <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTRegion" data-dfn-type="attribute" data-export="" id="dom-vttregion-width"><code>width</code></dfn> attribute, on getting, must return the <a data-link-type="dfn" href="#webvtt-region-width" id="ref-for-webvtt-region-width-8">WebVTT
-region width</a> of the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-18">WebVTT region</a> that the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-8">VTTRegion</a></code> object represents. On setting,
+region width</a> of the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-19">WebVTT region</a> that the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-8">VTTRegion</a></code> object represents. On setting,
 if the new value is negative or greater than 100, then an <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/WebIDL-1/#indexsizeerror">IndexSizeError</a></code> exception must be
 thrown. Otherwise, the <a data-link-type="dfn" href="#webvtt-region-width" id="ref-for-webvtt-region-width-9">WebVTT region width</a> must be set to the new value.</p>
    <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTRegion" data-dfn-type="attribute" data-export="" id="dom-vttregion-lines"><code>lines</code></dfn> attribute, on getting, must return the <a data-link-type="dfn" href="#webvtt-region-lines" id="ref-for-webvtt-region-lines-5">WebVTT
-region lines</a> of the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-19">WebVTT region</a> that the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-9">VTTRegion</a></code> object represents. On setting,
-if the new value is negative, then an <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/WebIDL-1/#indexsizeerror">IndexSizeError</a></code> exception must be thrown. Otherwise, the <a data-link-type="dfn" href="#webvtt-region-lines" id="ref-for-webvtt-region-lines-6">WebVTT region lines</a> must be set to the new value.</p>
-   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTRegion" data-dfn-type="attribute" data-export="" id="dom-vttregion-regionanchorx"><code>regionAnchorX</code></dfn> attribute, on getting, must return the <a data-link-type="dfn" href="#webvtt-region-anchor" id="ref-for-webvtt-region-anchor-9">WebVTT region anchor</a> X offset of the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-20">WebVTT region</a> that the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-10">VTTRegion</a></code> object
+region lines</a> of the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-20">WebVTT region</a> that the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-9">VTTRegion</a></code> object represents. On setting,
+the <a data-link-type="dfn" href="#webvtt-region-lines" id="ref-for-webvtt-region-lines-6">WebVTT region lines</a> must be set to the new value.</p>
+   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTRegion" data-dfn-type="attribute" data-export="" id="dom-vttregion-regionanchorx"><code>regionAnchorX</code></dfn> attribute, on getting, must return the <a data-link-type="dfn" href="#webvtt-region-anchor" id="ref-for-webvtt-region-anchor-9">WebVTT region anchor</a> X offset of the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-21">WebVTT region</a> that the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-10">VTTRegion</a></code> object
 represents. On setting, if the new value is negative or greater than 100, then an <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/WebIDL-1/#indexsizeerror">IndexSizeError</a></code> exception must be thrown. Otherwise, the <a data-link-type="dfn" href="#webvtt-region-anchor" id="ref-for-webvtt-region-anchor-10">WebVTT region anchor</a> X distance must be set to the
 new value.</p>
-   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTRegion" data-dfn-type="attribute" data-export="" id="dom-vttregion-regionanchory"><code>regionAnchorY</code></dfn> attribute, on getting, must return the <a data-link-type="dfn" href="#webvtt-region-anchor" id="ref-for-webvtt-region-anchor-11">WebVTT region anchor</a> Y offset of the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-21">WebVTT region</a> that the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-11">VTTRegion</a></code> object
+   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTRegion" data-dfn-type="attribute" data-export="" id="dom-vttregion-regionanchory"><code>regionAnchorY</code></dfn> attribute, on getting, must return the <a data-link-type="dfn" href="#webvtt-region-anchor" id="ref-for-webvtt-region-anchor-11">WebVTT region anchor</a> Y offset of the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-22">WebVTT region</a> that the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-11">VTTRegion</a></code> object
 represents. On setting, if the new value is negative or greater than 100, then an <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/WebIDL-1/#indexsizeerror">IndexSizeError</a></code> exception must be thrown. Otherwise, the <a data-link-type="dfn" href="#webvtt-region-anchor" id="ref-for-webvtt-region-anchor-12">WebVTT region anchor</a> Y distance must be set to the
 new value.</p>
-   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTRegion" data-dfn-type="attribute" data-export="" id="dom-vttregion-viewportanchorx"><code>viewportAnchorX</code></dfn> attribute, on getting, must return the <a data-link-type="dfn" href="#webvtt-region-viewport-anchor" id="ref-for-webvtt-region-viewport-anchor-5">WebVTT region viewport anchor</a> X offset of the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-22">WebVTT region</a> that the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-12">VTTRegion</a></code> object represents. On setting, if the new value is negative or greater than 100, then an <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/WebIDL-1/#indexsizeerror">IndexSizeError</a></code> exception must be thrown. Otherwise, the <a data-link-type="dfn" href="#webvtt-region-viewport-anchor" id="ref-for-webvtt-region-viewport-anchor-6">WebVTT region viewport anchor</a> X
+   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTRegion" data-dfn-type="attribute" data-export="" id="dom-vttregion-viewportanchorx"><code>viewportAnchorX</code></dfn> attribute, on getting, must return the <a data-link-type="dfn" href="#webvtt-region-viewport-anchor" id="ref-for-webvtt-region-viewport-anchor-5">WebVTT region viewport anchor</a> X offset of the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-23">WebVTT region</a> that the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-12">VTTRegion</a></code> object represents. On setting, if the new value is negative or greater than 100, then an <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/WebIDL-1/#indexsizeerror">IndexSizeError</a></code> exception must be thrown. Otherwise, the <a data-link-type="dfn" href="#webvtt-region-viewport-anchor" id="ref-for-webvtt-region-viewport-anchor-6">WebVTT region viewport anchor</a> X
 distance must be set to the new value.</p>
-   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTRegion" data-dfn-type="attribute" data-export="" id="dom-vttregion-viewportanchory"><code>viewportAnchorY</code></dfn> attribute, on getting, must return the <a data-link-type="dfn" href="#webvtt-region-viewport-anchor" id="ref-for-webvtt-region-viewport-anchor-7">WebVTT region viewport anchor</a> Y offset of the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-23">WebVTT region</a> that the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-13">VTTRegion</a></code> object represents. On setting, if the new value is negative or greater than 100, then an <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/WebIDL-1/#indexsizeerror">IndexSizeError</a></code> exception must be thrown. Otherwise, the <a data-link-type="dfn" href="#webvtt-region-viewport-anchor" id="ref-for-webvtt-region-viewport-anchor-8">WebVTT region viewport anchor</a> Y
+   <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTRegion" data-dfn-type="attribute" data-export="" id="dom-vttregion-viewportanchory"><code>viewportAnchorY</code></dfn> attribute, on getting, must return the <a data-link-type="dfn" href="#webvtt-region-viewport-anchor" id="ref-for-webvtt-region-viewport-anchor-7">WebVTT region viewport anchor</a> Y offset of the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-24">WebVTT region</a> that the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-13">VTTRegion</a></code> object represents. On setting, if the new value is negative or greater than 100, then an <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/WebIDL-1/#indexsizeerror">IndexSizeError</a></code> exception must be thrown. Otherwise, the <a data-link-type="dfn" href="#webvtt-region-viewport-anchor" id="ref-for-webvtt-region-viewport-anchor-8">WebVTT region viewport anchor</a> Y
 distance must be set to the new value.</p>
    <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="VTTRegion" data-dfn-type="attribute" data-export="" id="dom-vttregion-scroll"><code>scroll</code></dfn> attribute, on getting, must return the string from
-the second cell of the row in the table below whose first cell is the <a data-link-type="dfn" href="#webvtt-region-scroll" id="ref-for-webvtt-region-scroll-6">WebVTT region scroll</a> setting of the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-24">WebVTT region</a> that the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-14">VTTRegion</a></code> object represents:</p>
+the second cell of the row in the table below whose first cell is the <a data-link-type="dfn" href="#webvtt-region-scroll" id="ref-for-webvtt-region-scroll-6">WebVTT region scroll</a> setting of the <a data-link-type="dfn" href="#webvtt-region" id="ref-for-webvtt-region-25">WebVTT region</a> that the <code class="idl"><a data-link-type="idl" href="#vttregion" id="ref-for-vttregion-14">VTTRegion</a></code> object represents:</p>
    <table class="complex data">
     <thead>
      <tr>
@@ -5610,8 +5894,8 @@
    </table>
    <p>On setting, the <a data-link-type="dfn" href="#webvtt-region-scroll" id="ref-for-webvtt-region-scroll-8">WebVTT region scroll</a> must be set to the value given on the first cell of
 the row in the table above whose second cell is a <a data-link-type="dfn" href="https://www.w3.org/TR/html51/infrastructure.html#case-sensitive">case-sensitive</a> match for the new value.</p>
-   <h2 class="heading settled" data-level="9" id="iana"><span class="secno">9. </span><span class="content">IANA considerations</span><a class="self-link" href="#iana"></a></h2>
-   <h3 class="heading settled" data-level="9.1" id="iana-text-vtt"><span class="secno">9.1. </span><span class="content"><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="text-vtt"><code>text/vtt</code></dfn></span><a class="self-link" href="#iana-text-vtt"></a></h3>
+   <h2 class="heading settled" data-level="10" id="iana"><span class="secno">10. </span><span class="content">IANA considerations</span><a class="self-link" href="#iana"></a></h2>
+   <h3 class="heading settled" data-level="10.1" id="iana-text-vtt"><span class="secno">10.1. </span><span class="content"><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport="" id="text-vtt"><code>text/vtt</code></dfn></span><a class="self-link" href="#iana-text-vtt"></a></h3>
    <p>This registration is for community review and will be submitted to the IESG for review, approval,
 and registration with IANA.</p>
    <dl>
@@ -5696,7 +5980,7 @@
    <p>It is possible for a user agent to offer user style sheets, but their presence and nature will
 not be detectable by scripts running in the same user agent (e.g. browser) since the CSS object
 model for such style sheets is not exposed to script and there is no way to get the computed style
-for pseudo-elements other than <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/selectors-3/#sel-before">::before</a> and <a class="css" data-link-type="maybe" href="https://drafts.csswg.org/selectors-3/#sel-after">::after</a> with the <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/cssom-1/#dom-window-getcomputedstyle">getComputedStyle()</a></code> API. <a data-link-type="biblio" href="#biblio-cssom">[CSSOM]</a></p>
+for pseudo-elements other than <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css3-selectors/#sel-before">::before</a> and <a class="css" data-link-type="maybe" href="https://www.w3.org/TR/css3-selectors/#sel-after">::after</a> with the <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/cssom-1/#dom-window-getcomputedstyle">getComputedStyle()</a></code> API. <a data-link-type="biblio" href="#biblio-cssom">[CSSOM]</a></p>
    <h3 class="heading settled" id="scripting-security"><span class="content">Scripting-related security</span><a class="self-link" href="#scripting-security"></a></h3>
    <p>WebVTT does not include or enable scripting. It is important that user agents do not support a
 way to execute script embedded in a WebVTT file.</p>
@@ -5743,10 +6027,12 @@
  Lawrence Forooghian,
  Loretta Guarino Reid,
  Ms2ger,
+ Nigel Megitt,
  Ralph Giles,
  Richard Ishida,
  Rick Eyre,
- Ronny Mennerich, and
+ Ronny Mennerich,
+ Theresa O’Connor, and
  Victor Cărbune
  for their useful comments. </p>
   </main>
@@ -5757,250 +6043,258 @@
    <li>
     ""
     <ul>
-     <li><a href="#dom-directionsetting">enum-value for DirectionSetting</a><span>, in §8.1</span>
-     <li><a href="#dom-scrollsetting">enum-value for ScrollSetting</a><span>, in §8.2</span>
+     <li><a href="#dom-directionsetting">enum-value for DirectionSetting</a><span>, in §9.1</span>
+     <li><a href="#dom-scrollsetting">enum-value for ScrollSetting</a><span>, in §9.2</span>
     </ul>
-   <li><a href="#dom-vttcue-align">align</a><span>, in §8.1</span>
-   <li><a href="#enumdef-alignsetting">AlignSetting</a><span>, in §8.1</span>
-   <li><a href="#apply-webvtt-cue-settings">apply WebVTT cue settings</a><span>, in §6.1</span>
-   <li><a href="#attach-a-webvtt-internal-node-object">attach a WebVTT Internal Node Object</a><span>, in §5.4</span>
+   <li><a href="#dom-vttcue-align">align</a><span>, in §9.1</span>
+   <li><a href="#enumdef-alignsetting">AlignSetting</a><span>, in §9.1</span>
+   <li><a href="#apply-webvtt-cue-settings">apply WebVTT cue settings</a><span>, in §7.2</span>
+   <li><a href="#attach-a-webvtt-internal-node-object">attach a WebVTT Internal Node Object</a><span>, in §6.4</span>
    <li>
     auto
     <ul>
-     <li><a href="#dom-autokeyword-auto">enum-value for AutoKeyword</a><span>, in §8.1</span>
-     <li><a href="#dom-positionalignsetting-auto">enum-value for PositionAlignSetting</a><span>, in §8.1</span>
+     <li><a href="#dom-autokeyword-auto">enum-value for AutoKeyword</a><span>, in §9.1</span>
+     <li><a href="#dom-positionalignsetting-auto">enum-value for PositionAlignSetting</a><span>, in §9.1</span>
     </ul>
    <li>
     "auto"
     <ul>
-     <li><a href="#dom-autokeyword-auto">enum-value for AutoKeyword</a><span>, in §8.1</span>
-     <li><a href="#dom-positionalignsetting-auto">enum-value for PositionAlignSetting</a><span>, in §8.1</span>
+     <li><a href="#dom-autokeyword-auto">enum-value for AutoKeyword</a><span>, in §9.1</span>
+     <li><a href="#dom-positionalignsetting-auto">enum-value for PositionAlignSetting</a><span>, in §9.1</span>
     </ul>
-   <li><a href="#enumdef-autokeyword">AutoKeyword</a><span>, in §8.1</span>
+   <li><a href="#enumdef-autokeyword">AutoKeyword</a><span>, in §9.1</span>
    <li>
     "center"
     <ul>
-     <li><a href="#dom-linealignsetting-center">enum-value for LineAlignSetting</a><span>, in §8.1</span>
-     <li><a href="#dom-positionalignsetting-center">enum-value for PositionAlignSetting</a><span>, in §8.1</span>
-     <li><a href="#dom-alignsetting-center">enum-value for AlignSetting</a><span>, in §8.1</span>
+     <li><a href="#dom-linealignsetting-center">enum-value for LineAlignSetting</a><span>, in §9.1</span>
+     <li><a href="#dom-positionalignsetting-center">enum-value for PositionAlignSetting</a><span>, in §9.1</span>
+     <li><a href="#dom-alignsetting-center">enum-value for AlignSetting</a><span>, in §9.1</span>
     </ul>
    <li>
     center
     <ul>
-     <li><a href="#dom-linealignsetting-center">enum-value for LineAlignSetting</a><span>, in §8.1</span>
-     <li><a href="#dom-positionalignsetting-center">enum-value for PositionAlignSetting</a><span>, in §8.1</span>
-     <li><a href="#dom-alignsetting-center">enum-value for AlignSetting</a><span>, in §8.1</span>
-    </ul>
-   <li><a href="#collect-a-webvtt-block">collect a WebVTT block</a><span>, in §5.1</span>
-   <li><a href="#collect-a-webvtt-timestamp">collect a WebVTT timestamp</a><span>, in §5.3</span>
-   <li><a href="#collect-webvtt-cue-timings-and-settings">collect WebVTT cue timings and settings</a><span>, in §5.3</span>
-   <li><a href="#collect-webvtt-region-settings">collect WebVTT region settings</a><span>, in §5.2</span>
-   <li><a href="#consume-an-html-character-reference">consume an HTML character reference</a><span>, in §5.4</span>
-   <li><a href="#cue">::cue</a><span>, in §7.2.1</span>
-   <li><a href="#cue-computed-line">cue computed line</a><span>, in §3.1</span>
-   <li><a href="#cue-computed-position">cue computed position</a><span>, in §3.1</span>
-   <li><a href="#cue-computed-position-alignment">cue computed position alignment</a><span>, in §3.1</span>
+     <li><a href="#dom-linealignsetting-center">enum-value for LineAlignSetting</a><span>, in §9.1</span>
+     <li><a href="#dom-positionalignsetting-center">enum-value for PositionAlignSetting</a><span>, in §9.1</span>
+     <li><a href="#dom-alignsetting-center">enum-value for AlignSetting</a><span>, in §9.1</span>
+    </ul>
+   <li><a href="#collect-a-webvtt-block">collect a WebVTT block</a><span>, in §6.1</span>
+   <li><a href="#collect-a-webvtt-timestamp">collect a WebVTT timestamp</a><span>, in §6.3</span>
+   <li><a href="#collect-webvtt-cue-timings-and-settings">collect WebVTT cue timings and settings</a><span>, in §6.3</span>
+   <li><a href="#collect-webvtt-region-settings">collect WebVTT region settings</a><span>, in §6.2</span>
+   <li><a href="#consume-an-html-character-reference">consume an HTML character reference</a><span>, in §6.4</span>
+   <li><a href="#cue">::cue</a><span>, in §8.2.1</span>
+   <li><a href="#cue-component-class-names">cue component class names</a><span>, in §4.2.2</span>
+   <li><a href="#cue-computed-line">cue computed line</a><span>, in §3.3</span>
+   <li><a href="#cue-computed-position">cue computed position</a><span>, in §3.3</span>
+   <li><a href="#cue-computed-position-alignment">cue computed position alignment</a><span>, in §3.3</span>
    <li><a href="#cue-payload">cue payload</a><span>, in §4.1</span>
-   <li><a href="#cue-region">::cue-region</a><span>, in §7.2.3</span>
-   <li><a href="#cue-region-selector">::cue-region(selector)</a><span>, in §7.2.3</span>
-   <li><a href="#cue-selector">::cue(selector)</a><span>, in §7.2.1</span>
-   <li><a href="#enumdef-directionsetting">DirectionSetting</a><span>, in §8.1</span>
+   <li><a href="#cue-region">::cue-region</a><span>, in §8.2.3</span>
+   <li><a href="#cue-region-selector">::cue-region(selector)</a><span>, in §8.2.3</span>
+   <li><a href="#cue-selector">::cue(selector)</a><span>, in §8.2.1</span>
+   <li><a href="#cue-text">cue text</a><span>, in §3.2</span>
+   <li><a href="#enumdef-directionsetting">DirectionSetting</a><span>, in §9.1</span>
    <li>
     "end"
     <ul>
-     <li><a href="#dom-linealignsetting-end">enum-value for LineAlignSetting</a><span>, in §8.1</span>
-     <li><a href="#dom-alignsetting-end">enum-value for AlignSetting</a><span>, in §8.1</span>
+     <li><a href="#dom-linealignsetting-end">enum-value for LineAlignSetting</a><span>, in §9.1</span>
+     <li><a href="#dom-alignsetting-end">enum-value for AlignSetting</a><span>, in §9.1</span>
     </ul>
    <li>
     end
     <ul>
-     <li><a href="#dom-linealignsetting-end">enum-value for LineAlignSetting</a><span>, in §8.1</span>
-     <li><a href="#dom-alignsetting-end">enum-value for AlignSetting</a><span>, in §8.1</span>
+     <li><a href="#dom-linealignsetting-end">enum-value for LineAlignSetting</a><span>, in §9.1</span>
+     <li><a href="#dom-alignsetting-end">enum-value for AlignSetting</a><span>, in §9.1</span>
     </ul>
-   <li><a href="#future">:future</a><span>, in §7.2.2</span>
-   <li><a href="#dom-vttcue-getcueashtml">getCueAsHTML()</a><span>, in §8.1</span>
-   <li><a href="#html-character-reference-in-annotation-state">HTML character reference in annotation state</a><span>, in §5.4</span>
-   <li><a href="#html-character-reference-in-data-state">HTML character reference in data state</a><span>, in §5.4</span>
-   <li><a href="#dom-vttregion-id">id</a><span>, in §8.2</span>
-   <li><a href="#incremental-webvtt-parser">incremental WebVTT parser</a><span>, in §5.1</span>
-   <li><a href="#in-the-future">in the future</a><span>, in §7.2.2</span>
-   <li><a href="#in-the-past">in the past</a><span>, in §7.2.2</span>
-   <li><a href="#dom-alignsetting-left">"left"</a><span>, in §8.1</span>
-   <li><a href="#dom-alignsetting-left">left</a><span>, in §8.1</span>
-   <li><a href="#dom-vttcue-line">line</a><span>, in §8.1</span>
-   <li><a href="#dom-vttcue-linealign">lineAlign</a><span>, in §8.1</span>
-   <li><a href="#enumdef-linealignsetting">LineAlignSetting</a><span>, in §8.1</span>
-   <li><a href="#typedefdef-lineandpositionsetting">LineAndPositionSetting</a><span>, in §8.1</span>
-   <li><a href="#dom-positionalignsetting-line-left">"line-left"</a><span>, in §8.1</span>
-   <li><a href="#dom-positionalignsetting-line-left">line-left</a><span>, in §8.1</span>
-   <li><a href="#dom-positionalignsetting-line-right">"line-right"</a><span>, in §8.1</span>
-   <li><a href="#dom-positionalignsetting-line-right">line-right</a><span>, in §8.1</span>
-   <li><a href="#dom-vttregion-lines">lines</a><span>, in §8.2</span>
-   <li><a href="#list-of-webvtt-node-objects">List of WebVTT Node Objects</a><span>, in §5.4</span>
-   <li><a href="#dom-directionsetting-lr">"lr"</a><span>, in §8.1</span>
-   <li><a href="#dom-directionsetting-lr">lr</a><span>, in §8.1</span>
-   <li><a href="#parse-a-percentage-string">parse a percentage string</a><span>, in §5.2</span>
-   <li><a href="#parse-the-webvtt-cue-settings">parse the WebVTT cue settings</a><span>, in §5.3</span>
-   <li><a href="#past">:past</a><span>, in §7.2.2</span>
-   <li><a href="#dom-vttcue-position">position</a><span>, in §8.1</span>
-   <li><a href="#dom-vttcue-positionalign">positionAlign</a><span>, in §8.1</span>
-   <li><a href="#enumdef-positionalignsetting">PositionAlignSetting</a><span>, in §8.1</span>
-   <li><a href="#dom-vttcue-region">region</a><span>, in §8.1</span>
-   <li><a href="#dom-vttregion-regionanchorx">regionAnchorX</a><span>, in §8.2</span>
-   <li><a href="#dom-vttregion-regionanchory">regionAnchorY</a><span>, in §8.2</span>
-   <li><a href="#dom-alignsetting-right">right</a><span>, in §8.1</span>
-   <li><a href="#dom-alignsetting-right">"right"</a><span>, in §8.1</span>
-   <li><a href="#dom-directionsetting-rl">rl</a><span>, in §8.1</span>
-   <li><a href="#dom-directionsetting-rl">"rl"</a><span>, in §8.1</span>
-   <li><a href="#rules-for-updating-the-display-of-webvtt-text-tracks">rules for updating the display of WebVTT text tracks</a><span>, in §6.1</span>
-   <li><a href="#dom-vttregion-scroll">scroll</a><span>, in §8.2</span>
-   <li><a href="#enumdef-scrollsetting">ScrollSetting</a><span>, in §8.2</span>
-   <li><a href="#dom-vttcue-size">size</a><span>, in §8.1</span>
-   <li><a href="#dom-vttcue-snaptolines">snapToLines</a><span>, in §8.1</span>
+   <li><a href="#future">:future</a><span>, in §8.2.2</span>
+   <li><a href="#dom-vttcue-getcueashtml">getCueAsHTML()</a><span>, in §9.1</span>
+   <li><a href="#html-character-reference-in-annotation-state">HTML character reference in annotation state</a><span>, in §6.4</span>
+   <li><a href="#html-character-reference-in-data-state">HTML character reference in data state</a><span>, in §6.4</span>
+   <li><a href="#dom-vttregion-id">id</a><span>, in §9.2</span>
+   <li><a href="#incremental-webvtt-parser">incremental WebVTT parser</a><span>, in §6.1</span>
+   <li><a href="#in-the-future">in the future</a><span>, in §8.2.2</span>
+   <li><a href="#in-the-past">in the past</a><span>, in §8.2.2</span>
+   <li><a href="#dom-alignsetting-left">"left"</a><span>, in §9.1</span>
+   <li><a href="#dom-alignsetting-left">left</a><span>, in §9.1</span>
+   <li><a href="#dom-vttcue-line">line</a><span>, in §9.1</span>
+   <li><a href="#dom-vttcue-linealign">lineAlign</a><span>, in §9.1</span>
+   <li><a href="#enumdef-linealignsetting">LineAlignSetting</a><span>, in §9.1</span>
+   <li><a href="#typedefdef-lineandpositionsetting">LineAndPositionSetting</a><span>, in §9.1</span>
+   <li><a href="#dom-positionalignsetting-line-left">"line-left"</a><span>, in §9.1</span>
+   <li><a href="#dom-positionalignsetting-line-left">line-left</a><span>, in §9.1</span>
+   <li><a href="#dom-positionalignsetting-line-right">line-right</a><span>, in §9.1</span>
+   <li><a href="#dom-positionalignsetting-line-right">"line-right"</a><span>, in §9.1</span>
+   <li><a href="#dom-vttregion-lines">lines</a><span>, in §9.2</span>
+   <li><a href="#list-of-webvtt-node-objects">List of WebVTT Node Objects</a><span>, in §6.4</span>
+   <li><a href="#dom-directionsetting-lr">lr</a><span>, in §9.1</span>
+   <li><a href="#dom-directionsetting-lr">"lr"</a><span>, in §9.1</span>
+   <li><a href="#obtain-a-set-of-css-boxes">obtain a set of CSS boxes</a><span>, in §7.3</span>
+   <li><a href="#parse-a-percentage-string">parse a percentage string</a><span>, in §6.2</span>
+   <li><a href="#parse-the-webvtt-cue-settings">parse the WebVTT cue settings</a><span>, in §6.3</span>
+   <li><a href="#past">:past</a><span>, in §8.2.2</span>
+   <li><a href="#dom-vttcue-position">position</a><span>, in §9.1</span>
+   <li><a href="#dom-vttcue-positionalign">positionAlign</a><span>, in §9.1</span>
+   <li><a href="#enumdef-positionalignsetting">PositionAlignSetting</a><span>, in §9.1</span>
+   <li><a href="#dom-vttcue-region">region</a><span>, in §9.1</span>
+   <li><a href="#dom-vttregion-regionanchorx">regionAnchorX</a><span>, in §9.2</span>
+   <li><a href="#dom-vttregion-regionanchory">regionAnchorY</a><span>, in §9.2</span>
+   <li><a href="#dom-alignsetting-right">right</a><span>, in §9.1</span>
+   <li><a href="#dom-alignsetting-right">"right"</a><span>, in §9.1</span>
+   <li><a href="#dom-directionsetting-rl">rl</a><span>, in §9.1</span>
+   <li><a href="#dom-directionsetting-rl">"rl"</a><span>, in §9.1</span>
+   <li><a href="#rules-for-updating-the-display-of-webvtt-text-tracks">rules for updating the display of WebVTT text tracks</a><span>, in §7.1</span>
+   <li><a href="#dom-vttregion-scroll">scroll</a><span>, in §9.2</span>
+   <li><a href="#enumdef-scrollsetting">ScrollSetting</a><span>, in §9.2</span>
+   <li><a href="#dom-vttcue-size">size</a><span>, in §9.1</span>
+   <li><a href="#dom-vttcue-snaptolines">snapToLines</a><span>, in §9.1</span>
    <li>
     "start"
     <ul>
-     <li><a href="#dom-linealignsetting-start">enum-value for LineAlignSetting</a><span>, in §8.1</span>
-     <li><a href="#dom-alignsetting-start">enum-value for AlignSetting</a><span>, in §8.1</span>
+     <li><a href="#dom-linealignsetting-start">enum-value for LineAlignSetting</a><span>, in §9.1</span>
+     <li><a href="#dom-alignsetting-start">enum-value for AlignSetting</a><span>, in §9.1</span>
     </ul>
    <li>
     start
     <ul>
-     <li><a href="#dom-linealignsetting-start">enum-value for LineAlignSetting</a><span>, in §8.1</span>
-     <li><a href="#dom-alignsetting-start">enum-value for AlignSetting</a><span>, in §8.1</span>
+     <li><a href="#dom-linealignsetting-start">enum-value for LineAlignSetting</a><span>, in §9.1</span>
+     <li><a href="#dom-alignsetting-start">enum-value for AlignSetting</a><span>, in §9.1</span>
     </ul>
-   <li><a href="#dom-vttcue-text">text</a><span>, in §8.1</span>
-   <li><a href="#text-track-cue-text">text track cue text</a><span>, in §3.1</span>
-   <li><a href="#text-track-list-of-regions">text track list of regions</a><span>, in §3.2</span>
-   <li><a href="#text-vtt">text/vtt</a><span>, in §9.1</span>
-   <li><a href="#dom-scrollsetting-up">up</a><span>, in §8.2</span>
-   <li><a href="#dom-scrollsetting-up">"up"</a><span>, in §8.2</span>
-   <li><a href="#dom-vttcue-vertical">vertical</a><span>, in §8.1</span>
-   <li><a href="#dom-vttregion-viewportanchorx">viewportAnchorX</a><span>, in §8.2</span>
-   <li><a href="#dom-vttregion-viewportanchory">viewportAnchorY</a><span>, in §8.2</span>
-   <li><a href="#vttcue">VTTCue</a><span>, in §8.1</span>
-   <li><a href="#dom-vttcue-vttcue">VTTCue(startTime, endTime, text)</a><span>, in §8.1</span>
-   <li><a href="#dom-vttregion-vttregion">VTTRegion()</a><span>, in §8.2</span>
-   <li><a href="#vttregion">VTTRegion</a><span>, in §8.2</span>
+   <li><a href="#dom-vttcue-text">text</a><span>, in §9.1</span>
+   <li><a href="#text-track-list-of-regions">text track list of regions</a><span>, in §3.4</span>
+   <li><a href="#text-vtt">text/vtt</a><span>, in §10.1</span>
+   <li><a href="#dom-scrollsetting-up">up</a><span>, in §9.2</span>
+   <li><a href="#dom-scrollsetting-up">"up"</a><span>, in §9.2</span>
+   <li><a href="#user-agents-that-do-not-support-a-full-html-css-engine">User agents that do not support a full HTML CSS engine</a><span>, in §2.1</span>
+   <li><a href="#user-agents-that-do-not-support-css">User agents that do not support CSS</a><span>, in §2.1</span>
+   <li><a href="#user-agents-that-support-a-full-html-css-engine">User agents that support a full HTML CSS engine</a><span>, in §2.1</span>
+   <li><a href="#dom-vttcue-vertical">vertical</a><span>, in §9.1</span>
+   <li><a href="#dom-vttregion-viewportanchorx">viewportAnchorX</a><span>, in §9.2</span>
+   <li><a href="#dom-vttregion-viewportanchory">viewportAnchorY</a><span>, in §9.2</span>
+   <li><a href="#vttcue">VTTCue</a><span>, in §9.1</span>
+   <li><a href="#dom-vttcue-vttcue">VTTCue(startTime, endTime, text)</a><span>, in §9.1</span>
+   <li><a href="#dom-vttregion-vttregion">VTTRegion()</a><span>, in §9.2</span>
+   <li><a href="#vttregion">VTTRegion</a><span>, in §9.2</span>
    <li><a href="#webvtt">WebVTT</a><span>, in §1</span>
    <li><a href="#webvtt-alignment-cue-setting">WebVTT alignment cue setting</a><span>, in §4.4</span>
-   <li><a href="#webvtt-bold-object">WebVTT Bold Object</a><span>, in §5.4</span>
-   <li><a href="#webvtt-chapter-title-text">WebVTT chapter title text</a><span>, in §4.6.2</span>
-   <li><a href="#webvtt-class-object">WebVTT Class Object</a><span>, in §5.4</span>
+   <li><a href="#webvtt-bold-object">WebVTT Bold Object</a><span>, in §6.4</span>
+   <li><a href="#webvtt-caption-or-subtitle-cue">WebVTT caption or subtitle cue</a><span>, in §3.3</span>
+   <li><a href="#webvtt-caption-or-subtitle-cue-components">WebVTT caption or subtitle cue components</a><span>, in §4.2.2</span>
+   <li><a href="#webvtt-caption-or-subtitle-cue-text">WebVTT caption or subtitle cue text</a><span>, in §4.2.2</span>
+   <li><a href="#webvtt-chapter-cue">WebVTT chapter cue</a><span>, in §3.5</span>
+   <li><a href="#webvtt-chapter-title-text">WebVTT chapter title text</a><span>, in §4.2.3</span>
+   <li><a href="#webvtt-class-object">WebVTT Class Object</a><span>, in §6.4</span>
    <li><a href="#webvtt-comment-block">WebVTT comment block</a><span>, in §4.1</span>
-   <li><a href="#webvtt-cue">WebVTT cue</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-automatic-position">WebVTT cue automatic position</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-background-box">WebVTT cue background box</a><span>, in §6.1</span>
+   <li><a href="#webvtt-cue">WebVTT cue</a><span>, in §3.2</span>
+   <li><a href="#webvtt-cue-automatic-position">WebVTT cue automatic position</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-background-box">WebVTT cue background box</a><span>, in §7.3</span>
    <li><a href="#webvtt-cue-block">WebVTT cue block</a><span>, in §4.1</span>
    <li><a href="#webvtt-cue-bold-span">WebVTT cue bold span</a><span>, in §4.2.2</span>
-   <li><a href="#webvtt-cue-box">WebVTT cue box</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-center-alignment">WebVTT cue center alignment</a><span>, in §3.1</span>
+   <li><a href="#webvtt-cue-box">WebVTT cue box</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-center-alignment">WebVTT cue center alignment</a><span>, in §3.3</span>
    <li><a href="#webvtt-cue-class-span">WebVTT cue class span</a><span>, in §4.2.2</span>
-   <li><a href="#webvtt-cue-components">WebVTT cue components</a><span>, in §4.2.2</span>
-   <li><a href="#webvtt-cue-end-alignment">WebVTT cue end alignment</a><span>, in §3.1</span>
+   <li><a href="#webvtt-cue-end-alignment">WebVTT cue end alignment</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-horizontal-writing-direction">WebVTT cue horizontal writing direction</a><span>, in §3.3</span>
-   <li><a href="#webvtt-cue-horizontal-writing-direction">WebVTT cue horizontal writing direction</a><span>, in §3.1</span>
    <li><a href="#webvtt-cue-identifier">WebVTT cue identifier</a><span>, in §4.1</span>
    <li><a href="#webvtt-cue-internal-text">WebVTT cue internal text</a><span>, in §4.2.2</span>
    <li><a href="#webvtt-cue-italics-span">WebVTT cue italics span</a><span>, in §4.2.2</span>
    <li><a href="#webvtt-cue-language-span">WebVTT cue language span</a><span>, in §4.2.2</span>
-   <li><a href="#webvtt-cue-left-alignment">WebVTT cue left alignment</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-line">WebVTT cue line</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-line-alignment">WebVTT cue line alignment</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-line-automatic">WebVTT cue line automatic</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-line-center-alignment">WebVTT cue line center alignment</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-line-end-alignment">WebVTT cue line end alignment</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-line-start-alignment">WebVTT cue line start alignment</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-position">WebVTT cue position</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-position-alignment">WebVTT cue position alignment</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-position-automatic-alignment">WebVTT cue position automatic alignment</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-position-center-alignment">WebVTT cue position center alignment</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-position-line-left-alignment">WebVTT cue position line-left alignment</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-position-line-right-alignment">WebVTT cue position line-right alignment</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-region">WebVTT cue region</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-right-alignment">WebVTT cue right alignment</a><span>, in §3.1</span>
+   <li><a href="#webvtt-cue-left-alignment">WebVTT cue left alignment</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-line">WebVTT cue line</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-line-alignment">WebVTT cue line alignment</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-line-automatic">WebVTT cue line automatic</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-line-center-alignment">WebVTT cue line center alignment</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-line-end-alignment">WebVTT cue line end alignment</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-line-start-alignment">WebVTT cue line start alignment</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-position">WebVTT cue position</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-position-alignment">WebVTT cue position alignment</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-position-automatic-alignment">WebVTT cue position automatic alignment</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-position-center-alignment">WebVTT cue position center alignment</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-position-line-left-alignment">WebVTT cue position line-left alignment</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-position-line-right-alignment">WebVTT cue position line-right alignment</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-region">WebVTT cue region</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-right-alignment">WebVTT cue right alignment</a><span>, in §3.3</span>
    <li><a href="#webvtt-cue-ruby-span">WebVTT cue ruby span</a><span>, in §4.2.2</span>
    <li><a href="#webvtt-cue-ruby-text-span">WebVTT cue ruby text span</a><span>, in §4.2.2</span>
    <li><a href="#webvtt-cue-setting">WebVTT cue setting</a><span>, in §4.1</span>
    <li><a href="#webvtt-cue-setting-name">WebVTT cue setting name</a><span>, in §4.1</span>
    <li><a href="#webvtt-cue-settings-list">WebVTT cue settings list</a><span>, in §4.1</span>
    <li><a href="#webvtt-cue-setting-value">WebVTT cue setting value</a><span>, in §4.1</span>
-   <li><a href="#webvtt-cue-size">WebVTT cue size</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-snap-to-lines-flag">WebVTT cue snap-to-lines flag</a><span>, in §3.1</span>
+   <li><a href="#webvtt-cue-size">WebVTT cue size</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-snap-to-lines-flag">WebVTT cue snap-to-lines flag</a><span>, in §3.3</span>
    <li><a href="#webvtt-cue-span-end-tag">WebVTT cue span end tag</a><span>, in §4.2.2</span>
    <li><a href="#webvtt-cue-span-start-tag">WebVTT cue span start tag</a><span>, in §4.2.2</span>
    <li><a href="#webvtt-cue-span-start-tag-annotation-text">WebVTT cue span start tag annotation text</a><span>, in §4.2.2</span>
-   <li><a href="#webvtt-cue-start-alignment">WebVTT cue start alignment</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-text">WebVTT cue text</a><span>, in §4.2.2</span>
-   <li><a href="#webvtt-cue-text-alignment">WebVTT cue text alignment</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-text-dom-construction-rules">WebVTT cue text DOM construction rules</a><span>, in §5.5</span>
+   <li><a href="#webvtt-cue-start-alignment">WebVTT cue start alignment</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-text-alignment">WebVTT cue text alignment</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-text-dom-construction-rules">WebVTT cue text DOM construction rules</a><span>, in §6.5</span>
+   <li><a href="#webvtt-cue-text-parsing-rules">WebVTT cue text parsing rules</a><span>, in §6.4</span>
-   <li><a href="#webvtt-cue-text-parsing-rules">WebVTT cue text parsing rules</a><span>, in §5.4</span>
    <li><a href="#webvtt-cue-text-span">WebVTT cue text span</a><span>, in §4.2.2</span>
-   <li><a href="#webvtt-cue-text-tokenizer">WebVTT cue text tokenizer</a><span>, in §5.4</span>
+   <li><a href="#webvtt-cue-text-tokenizer">WebVTT cue text tokenizer</a><span>, in §6.4</span>
    <li><a href="#webvtt-cue-timestamp">WebVTT cue timestamp</a><span>, in §4.2.2</span>
    <li><a href="#webvtt-cue-timings">WebVTT cue timings</a><span>, in §4.1</span>
    <li><a href="#webvtt-cue-underline-span">WebVTT cue underline span</a><span>, in §4.2.2</span>
-   <li><a href="#webvtt-cue-vertical-growing-left-writing-direction">WebVTT cue vertical growing left writing direction</a><span>, in §3.1</span>
-   <li><a href="#webvtt-cue-vertical-growing-right-writing-direction">WebVTT cue vertical growing right writing direction</a><span>, in §3.1</span>
+   <li><a href="#webvtt-cue-vertical-growing-left-writing-direction">WebVTT cue vertical growing left writing direction</a><span>, in §3.3</span>
+   <li><a href="#webvtt-cue-vertical-growing-right-writing-direction">WebVTT cue vertical growing right writing direction</a><span>, in §3.3</span>
    <li><a href="#webvtt-cue-voice-span">WebVTT cue voice span</a><span>, in §4.2.2</span>
-   <li><a href="#webvtt-cue-writing-direction">WebVTT cue writing direction</a><span>, in §3.1</span>
-   <li><a href="#webvtt-data-state">WebVTT data state</a><span>, in §5.4</span>
-   <li><a href="#webvtt-end-tag-state">WebVTT end tag state</a><span>, in §5.4</span>
+   <li><a href="#webvtt-cue-writing-direction">WebVTT cue writing direction</a><span>, in §3.3</span>
+   <li><a href="#webvtt-data-state">WebVTT data state</a><span>, in §6.4</span>
+   <li><a href="#webvtt-end-tag-state">WebVTT end tag state</a><span>, in §6.4</span>
    <li><a href="#webvtt-file">WebVTT file</a><span>, in §4.1</span>
    <li><a href="#webvtt-file-body">WebVTT file body</a><span>, in §4.1</span>
+   <li><a href="#webvtt-file-using-caption-or-subtitle-cue-text">WebVTT file using caption or subtitle cue text</a><span>, in §4.6.3</span>
    <li><a href="#webvtt-file-using-chapter-title-text">WebVTT file using chapter title text</a><span>, in §4.6.2</span>
-   <li><a href="#webvtt-file-using-cue-text">WebVTT file using cue text</a><span>, in §4.6.3</span>
    <li><a href="#webvtt-file-using-metadata-content">WebVTT file using metadata content</a><span>, in §4.6.1</span>
    <li><a href="#webvtt-file-using-only-nested-cues">WebVTT file using only nested cues</a><span>, in §4.5.1</span>
-   <li><a href="#webvtt-internal-node-object">WebVTT Internal Node Object</a><span>, in §5.4</span>
-   <li><a href="#webvtt-italic-object">WebVTT Italic Object</a><span>, in §5.4</span>
-   <li><a href="#webvtt-language-object">WebVTT Language Object</a><span>, in §5.4</span>
-   <li><a href="#webvtt-leaf-node-object">WebVTT Leaf Node Object</a><span>, in §5.4</span>
+   <li><a href="#webvtt-internal-node-object">WebVTT Internal Node Object</a><span>, in §6.4</span>
+   <li><a href="#webvtt-italic-object">WebVTT Italic Object</a><span>, in §6.4</span>
+   <li><a href="#webvtt-language-object">WebVTT Language Object</a><span>, in §6.4</span>
+   <li><a href="#webvtt-leaf-node-object">WebVTT Leaf Node Object</a><span>, in §6.4</span>
    <li><a href="#webvtt-line-cue-setting">WebVTT line cue setting</a><span>, in §4.4</span>
    <li><a href="#webvtt-line-terminator">WebVTT line terminator</a><span>, in §4.1</span>
+   <li><a href="#webvtt-metadata-cue">WebVTT metadata cue</a><span>, in §3.6</span>
    <li><a href="#webvtt-metadata-text">WebVTT metadata text</a><span>, in §4.2.1</span>
-   <li><a href="#webvtt-node-object">WebVTT Node Object</a><span>, in §5.4</span>
-   <li><a href="#webvtt-node-objects-applicable-classes">WebVTT Node Object’s applicable classes</a><span>, in §5.4</span>
-   <li><a href="#webvtt-node-objects-applicable-language">WebVTT Node Object’s applicable language</a><span>, in §5.4</span>
-   <li><a href="#webvtt-parser">WebVTT parser</a><span>, in §5.1</span>
-   <li><a href="#webvtt-parser-algorithm">WebVTT parser algorithm</a><span>, in §5.1</span>
+   <li><a href="#webvtt-node-object">WebVTT Node Object</a><span>, in §6.4</span>
+   <li><a href="#webvtt-node-objects-applicable-classes">WebVTT Node Object’s applicable classes</a><span>, in §6.4</span>
+   <li><a href="#webvtt-node-objects-applicable-language">WebVTT Node Object’s applicable language</a><span>, in §6.4</span>
+   <li><a href="#webvtt-parser">WebVTT parser</a><span>, in §6.1</span>
+   <li><a href="#webvtt-parser-algorithm">WebVTT parser algorithm</a><span>, in §6.1</span>
    <li><a href="#webvtt-percentage">WebVTT percentage</a><span>, in §4.1</span>
    <li><a href="#webvtt-position-cue-setting">WebVTT position cue setting</a><span>, in §4.4</span>
-   <li><a href="#webvtt-region">WebVTT region</a><span>, in §3.2</span>
-   <li><a href="#webvtt-region-anchor">WebVTT region anchor</a><span>, in §3.2</span>
+   <li><a href="#webvtt-region">WebVTT region</a><span>, in §3.4</span>
+   <li><a href="#webvtt-region-anchor">WebVTT region anchor</a><span>, in §3.4</span>
    <li><a href="#webvtt-region-anchor-setting">WebVTT region anchor setting</a><span>, in §4.3</span>
    <li><a href="#webvtt-region-cue-setting">WebVTT region cue setting</a><span>, in §4.4</span>
    <li><a href="#webvtt-region-definition-block">WebVTT region definition block</a><span>, in §4.1</span>
-   <li><a href="#webvtt-region-identifier">WebVTT region identifier</a><span>, in §3.2</span>
+   <li><a href="#webvtt-region-identifier">WebVTT region identifier</a><span>, in §3.4</span>
    <li><a href="#webvtt-region-identifier-setting">WebVTT region identifier setting</a><span>, in §4.3</span>
-   <li><a href="#webvtt-region-lines">WebVTT region lines</a><span>, in §3.2</span>
+   <li><a href="#webvtt-region-lines">WebVTT region lines</a><span>, in §3.4</span>
    <li><a href="#webvtt-region-lines-setting">WebVTT region lines setting</a><span>, in §4.3</span>
-   <li><a href="#webvtt-region-object">WebVTT region object</a><span>, in §5.2</span>
-   <li><a href="#webvtt-region-scroll">WebVTT region scroll</a><span>, in §3.2</span>
-   <li><a href="#webvtt-region-scroll-none">WebVTT region scroll none</a><span>, in §3.2</span>
+   <li><a href="#webvtt-region-object">WebVTT region object</a><span>, in §6.2</span>
+   <li><a href="#webvtt-region-scroll">WebVTT region scroll</a><span>, in §3.4</span>
+   <li><a href="#webvtt-region-scroll-none">WebVTT region scroll none</a><span>, in §3.4</span>
    <li><a href="#webvtt-region-scroll-setting">WebVTT region scroll setting</a><span>, in §4.3</span>
-   <li><a href="#webvtt-region-scroll-up">WebVTT region scroll up</a><span>, in §3.2</span>
+   <li><a href="#webvtt-region-scroll-up">WebVTT region scroll up</a><span>, in §3.4</span>
    <li><a href="#webvtt-region-settings-list">WebVTT region settings list</a><span>, in §4.3</span>
-   <li><a href="#webvtt-region-viewport-anchor">WebVTT region viewport anchor</a><span>, in §3.2</span>
+   <li><a href="#webvtt-region-viewport-anchor">WebVTT region viewport anchor</a><span>, in §3.4</span>
    <li><a href="#webvtt-region-viewport-anchor-setting">WebVTT region viewport anchor setting</a><span>, in §4.3</span>
-   <li><a href="#webvtt-region-width">WebVTT region width</a><span>, in §3.2</span>
+   <li><a href="#webvtt-region-width">WebVTT region width</a><span>, in §3.4</span>
    <li><a href="#webvtt-region-width-setting">WebVTT region width setting</a><span>, in §4.3</span>
-   <li><a href="#webvtt-ruby-object">WebVTT Ruby Object</a><span>, in §5.4</span>
-   <li><a href="#webvtt-ruby-text-object">WebVTT Ruby Text Object</a><span>, in §5.4</span>
-   <li><a href="#webvtt-rules-for-extracting-the-chapter-title">WebVTT rules for extracting the chapter title</a><span>, in §5.6</span>
+   <li><a href="#webvtt-ruby-object">WebVTT Ruby Object</a><span>, in §6.4</span>
+   <li><a href="#webvtt-ruby-text-object">WebVTT Ruby Text Object</a><span>, in §6.4</span>
+   <li><a href="#webvtt-rules-for-extracting-the-chapter-title">WebVTT rules for extracting the chapter title</a><span>, in §6.6</span>
    <li><a href="#webvtt-size-cue-setting">WebVTT size cue setting</a><span>, in §4.4</span>
-   <li><a href="#webvtt-start-tag-annotation-state">WebVTT start tag annotation state</a><span>, in §5.4</span>
-   <li><a href="#webvtt-start-tag-class-state">WebVTT start tag class state</a><span>, in §5.4</span>
-   <li><a href="#webvtt-start-tag-state">WebVTT start tag state</a><span>, in §5.4</span>
+   <li><a href="#webvtt-start-tag-annotation-state">WebVTT start tag annotation state</a><span>, in §6.4</span>
+   <li><a href="#webvtt-start-tag-class-state">WebVTT start tag class state</a><span>, in §6.4</span>
+   <li><a href="#webvtt-start-tag-state">WebVTT start tag state</a><span>, in §6.4</span>
    <li><a href="#webvtt-style-block">WebVTT style block</a><span>, in §4.1</span>
-   <li><a href="#webvtt-tag-state">WebVTT tag state</a><span>, in §5.4</span>
-   <li><a href="#webvtt-text-object">WebVTT Text Object</a><span>, in §5.4</span>
+   <li><a href="#webvtt-tag-state">WebVTT tag state</a><span>, in §6.4</span>
+   <li><a href="#webvtt-text-object">WebVTT Text Object</a><span>, in §6.4</span>
    <li><a href="#webvtt-timestamp">WebVTT timestamp</a><span>, in §4.1</span>
-   <li><a href="#webvtt-timestamp-object">WebVTT Timestamp Object</a><span>, in §5.4</span>
-   <li><a href="#webvtt-timestamp-tag-state">WebVTT timestamp tag state</a><span>, in §5.4</span>
-   <li><a href="#webvtt-underline-object">WebVTT Underline Object</a><span>, in §5.4</span>
+   <li><a href="#webvtt-timestamp-object">WebVTT Timestamp Object</a><span>, in §6.4</span>
+   <li><a href="#webvtt-timestamp-tag-state">WebVTT timestamp tag state</a><span>, in §6.4</span>
+   <li><a href="#webvtt-underline-object">WebVTT Underline Object</a><span>, in §6.4</span>
    <li><a href="#webvtt-vertical-text-cue-setting">WebVTT vertical text cue setting</a><span>, in §4.4</span>
-   <li><a href="#webvtt-voice-object">WebVTT Voice Object</a><span>, in §5.4</span>
-   <li><a href="#dom-vttregion-width">width</a><span>, in §8.2</span>
+   <li><a href="#webvtt-voice-object">WebVTT Voice Object</a><span>, in §6.4</span>
+   <li><a href="#dom-vttregion-width">width</a><span>, in §9.2</span>
   </ul>
   <h3 class="no-num no-ref heading settled" id="index-defined-elsewhere"><span class="content">Terms defined by reference</span><a class="self-link" href="#index-defined-elsewhere"></a></h3>
   <ul class="index">
@@ -6012,19 +6306,21 @@
    <li>
     <a data-link-type="biblio">[css-backgrounds-3]</a> defines the following terms:
     <ul>
-     <li><a href="https://www.w3.org/TR/css3-background/#background">background</a>
-     <li><a href="https://www.w3.org/TR/css3-background/#background-image">background-image</a>
+     <li><a href="https://www.w3.org/TR/css3-background/#propdef-background">background</a>
+     <li><a href="https://www.w3.org/TR/css3-background/#propdef-background-color">background-color</a>
+     <li><a href="https://www.w3.org/TR/css3-background/#propdef-background-image">background-image</a>
     </ul>
    <li>
     <a data-link-type="biblio">[css-cascade-4]</a> defines the following terms:
     <ul>
-     <li><a href="https://drafts.csswg.org/css-cascade-4/#at-ruledef-import">@import</a>
-     <li><a href="https://drafts.csswg.org/css-cascade-4/#cascade">cascade</a>
+     <li><a href="https://www.w3.org/TR/css-cascade-4/#at-ruledef-import">@import</a>
+     <li><a href="https://www.w3.org/TR/css-cascade-4/#cascade">cascade</a>
     </ul>
    <li>
     <a data-link-type="biblio">[css-color-4]</a> defines the following terms:
     <ul>
      <li><a href="https://www.w3.org/TR/css-color-4/#propdef-color">color</a>
+     <li><a href="https://www.w3.org/TR/css-color-4/#valdef-color-green">green</a>
      <li><a href="https://www.w3.org/TR/css-color-4/#propdef-opacity">opacity</a>
     </ul>
    <li>
@@ -6050,8 +6346,8 @@
    <li>
     <a data-link-type="biblio">[css-fonts-4]</a> defines the following terms:
     <ul>
-     <li><a href="https://drafts.csswg.org/css-fonts-4/#valdef-font-weight-bold">bold</a>
-     <li><a href="https://drafts.csswg.org/css-fonts-4/#valdef-font-style-italic">italic</a>
+     <li><a href="https://www.w3.org/TR/css-fonts-4/#valdef-font-weight-bold">bold</a>
+     <li><a href="https://www.w3.org/TR/css-fonts-4/#valdef-font-style-italic">italic</a>
     </ul>
    <li>
     <a data-link-type="biblio">[css-overflow-3]</a> defines the following terms:
@@ -6069,6 +6365,11 @@
      <li><a href="https://www.w3.org/TR/css3-positioning/#propdef-top">top</a>
     </ul>
    <li>
+    <a data-link-type="biblio">[css-sizing-3]</a> defines the following terms:
+    <ul>
+     <li><a href="https://drafts.csswg.org/css-sizing-3/#valdef-width-auto">auto</a>
+    </ul>
+   <li>
     <a data-link-type="biblio">[CSS-SYNTAX-3]</a> defines the following terms:
     <ul>
      <li><a href="https://www.w3.org/TR/css-syntax-3/#parse-a-stylesheet0">parse a stylesheet</a>
@@ -6076,16 +6377,16 @@
    <li>
     <a data-link-type="biblio">[css-text-3]</a> defines the following terms:
     <ul>
-     <li><a href="https://drafts.csswg.org/css-text-3/#valdef-overflow-wrap-break-word">break-word</a>
-     <li><a href="https://drafts.csswg.org/css-text-3/#valdef-text-align-center">center</a>
-     <li><a href="https://drafts.csswg.org/css-text-3/#valdef-text-align-end">end</a>
-     <li><a href="https://drafts.csswg.org/css-text-3/#valdef-text-align-left">left</a>
-     <li><a href="https://www.w3.org/TR/css-text-3/#overflow-wrap">overflow-wrap</a>
-     <li><a href="https://drafts.csswg.org/css-text-3/#valdef-white-space-pre-line">pre-line</a>
-     <li><a href="https://drafts.csswg.org/css-text-3/#valdef-text-align-right">right</a>
-     <li><a href="https://drafts.csswg.org/css-text-3/#valdef-text-align-start">start</a>
-     <li><a href="https://www.w3.org/TR/css-text-3/#text-align">text-align</a>
-     <li><a href="https://www.w3.org/TR/css-text-3/#white-space">white-space</a>
+     <li><a href="https://www.w3.org/TR/css-text-3/#valdef-overflow-wrap-break-word">break-word</a>
+     <li><a href="https://www.w3.org/TR/css-text-3/#valdef-text-align-center">center</a>
+     <li><a href="https://www.w3.org/TR/css-text-3/#valdef-text-align-end">end</a>
+     <li><a href="https://www.w3.org/TR/css-text-3/#valdef-text-align-left">left</a>
+     <li><a href="https://www.w3.org/TR/css-text-3/#propdef-overflow-wrap">overflow-wrap</a>
+     <li><a href="https://www.w3.org/TR/css-text-3/#valdef-white-space-pre-line">pre-line</a>
+     <li><a href="https://www.w3.org/TR/css-text-3/#valdef-text-align-right">right</a>
+     <li><a href="https://www.w3.org/TR/css-text-3/#valdef-text-align-start">start</a>
+     <li><a href="https://www.w3.org/TR/css-text-3/#propdef-text-align">text-align</a>
+     <li><a href="https://www.w3.org/TR/css-text-3/#propdef-white-space">white-space</a>
     </ul>
    <li>
     <a data-link-type="biblio">[css-text-decor-3]</a> defines the following terms:
@@ -6096,13 +6397,13 @@
    <li>
     <a data-link-type="biblio">[css-transitions-1]</a> defines the following terms:
     <ul>
-     <li><a href="https://www.w3.org/TR/css3-transitions/#transition-duration">transition-duration</a>
-     <li><a href="https://www.w3.org/TR/css3-transitions/#transition-property">transition-property</a>
+     <li><a href="https://www.w3.org/TR/css3-transitions/#propdef-transition-duration">transition-duration</a>
+     <li><a href="https://www.w3.org/TR/css3-transitions/#propdef-transition-property">transition-property</a>
     </ul>
    <li>
-    <a data-link-type="biblio">[css-ui-3]</a> defines the following terms:
+    <a data-link-type="biblio">[css-ui-4]</a> defines the following terms:
     <ul>
-     <li><a href="https://www.w3.org/TR/css3-ui/#propdef-outline">outline</a>
+     <li><a href="https://drafts.csswg.org/css-ui-4/#propdef-outline">outline</a>
     </ul>
    <li>
     <a data-link-type="biblio">[CSS-VALUES]</a> defines the following terms:
@@ -6175,22 +6476,33 @@
      <li><a href="https://www.w3.org/TR/encoding/#utf-8-decode">utf-8 decode</a>
     </ul>
    <li>
+    <a data-link-type="biblio">[HTML]</a> defines the following terms:
+    <ul>
+     <li><a href="https://html.spec.whatwg.org/multipage/rendering.html#presentational-hints">presentational hints</a>
+    </ul>
+   <li>
     <a data-link-type="biblio">[selectors-3]</a> defines the following terms:
     <ul>
-     <li><a href="https://drafts.csswg.org/selectors-3/#sel-after">::after</a>
-     <li><a href="https://drafts.csswg.org/selectors-3/#sel-before">::before</a>
+     <li><a href="https://www.w3.org/TR/css3-selectors/#sel-after">::after</a>
+     <li><a href="https://www.w3.org/TR/css3-selectors/#sel-before">::before</a>
     </ul>
    <li>
-    <a data-link-type="biblio">[selectors-4]</a> defines the following terms:
+    <a data-link-type="biblio">[SELECTORS4]</a> defines the following terms:
     <ul>
      <li><a href="https://www.w3.org/TR/selectors4/#future-pseudo">:future</a>
      <li><a href="https://www.w3.org/TR/selectors4/#lang-pseudo">:lang()</a>
-     <li><a href="https://drafts.csswg.org/selectors-4/#past-pseudo">:past</a>
-     <li><a href="https://drafts.csswg.org/selectors-4/#attribute-selector">attribute selector</a>
-     <li><a href="https://drafts.csswg.org/selectors-4/#class-selector">class selector</a>
-     <li><a href="https://drafts.csswg.org/selectors-4/#id-selector">id selector</a>
+     <li><a href="https://www.w3.org/TR/selectors4/#past-pseudo">:past</a>
+     <li><a href="https://www.w3.org/TR/selectors4/#attribute-selector">attribute selector</a>
+     <li><a href="https://www.w3.org/TR/selectors4/#class-selector">class selector</a>
+     <li><a href="https://www.w3.org/TR/selectors4/#id-selector">id selector</a>
      <li><a href="https://www.w3.org/TR/selectors4/#originating-element">originating element</a>
-     <li><a href="https://drafts.csswg.org/selectors-4/#type-selector">type selector</a>
+     <li><a href="https://www.w3.org/TR/selectors4/#type-selector">type selector</a>
+    </ul>
+   <li>
+    <a data-link-type="biblio">[WebIDL]</a> defines the following terms:
+    <ul>
+     <li><a href="https://heycam.github.io/webidl/#Exposed">Exposed</a>
+     <li><a href="https://heycam.github.io/webidl/#idl-unsigned-long">unsigned long</a>
     </ul>
    <li>
     <a data-link-type="biblio">[WEBIDL-1]</a> defines the following terms:
@@ -6199,7 +6511,6 @@
      <li><a href="https://www.w3.org/TR/WebIDL-1/#indexsizeerror">IndexSizeError</a>
      <li><a href="https://www.w3.org/TR/WebIDL-1/#idl-boolean">boolean</a>
      <li><a href="https://www.w3.org/TR/WebIDL-1/#idl-double">double</a>
-     <li><a href="https://www.w3.org/TR/WebIDL-1/#idl-long">long</a>
     </ul>
   </ul>
   <h2 class="no-num no-ref heading settled" id="references"><span class="content">References</span><a class="self-link" href="#references"></a></h2>
@@ -6208,11 +6519,11 @@
    <dt id="biblio-bcp47">[BCP47]
    <dd>A. Phillips; M. Davis. <a href="https://tools.ietf.org/html/bcp47">Tags for Identifying Languages</a>. September 2009. IETF Best Current Practice. URL: <a href="https://tools.ietf.org/html/bcp47">https://tools.ietf.org/html/bcp47</a>
    <dt id="biblio-bidi">[BIDI]
-   <dd>Mark Davis; Aharon Lanin; Andrew Glass. <a href="http://www.unicode.org/reports/tr9/tr9-35.html">Unicode Bidirectional Algorithm</a>. 18 May 2016. Unicode Standard Annex #9. URL: <a href="http://www.unicode.org/reports/tr9/tr9-35.html">http://www.unicode.org/reports/tr9/tr9-35.html</a>
+   <dd>Mark Davis; Aharon Lanin; Andrew Glass. <a href="https://www.unicode.org/reports/tr9/tr9-37.html">Unicode Bidirectional Algorithm</a>. 14 May 2017. Unicode Standard Annex #9. URL: <a href="https://www.unicode.org/reports/tr9/tr9-37.html">https://www.unicode.org/reports/tr9/tr9-37.html</a>
    <dt id="biblio-css-align-3">[CSS-ALIGN-3]
    <dd>Elika Etemad; Tab Atkins Jr.. <a href="https://www.w3.org/TR/css-align-3/">CSS Box Alignment Module Level 3</a>. URL: <a href="https://www.w3.org/TR/css-align-3/">https://www.w3.org/TR/css-align-3/</a>
    <dt id="biblio-css-backgrounds-3">[CSS-BACKGROUNDS-3]
-   <dd>CSS Backgrounds and Borders Module Level 3 URL: <a href="https://www.w3.org/TR/css3-background/">https://www.w3.org/TR/css3-background/</a>
+   <dd>Bert Bos; Elika Etemad; Brad Kemper. <a href="https://www.w3.org/TR/css-backgrounds-3/">CSS Backgrounds and Borders Module Level 3</a>. URL: <a href="https://www.w3.org/TR/css-backgrounds-3/">https://www.w3.org/TR/css-backgrounds-3/</a>
    <dt id="biblio-css-cascade-4">[CSS-CASCADE-4]
    <dd>Elika Etemad; Tab Atkins Jr.. <a href="https://www.w3.org/TR/css-cascade-4/">CSS Cascading and Inheritance Level 4</a>. URL: <a href="https://www.w3.org/TR/css-cascade-4/">https://www.w3.org/TR/css-cascade-4/</a>
    <dt id="biblio-css-color-4">[CSS-COLOR-4]
@@ -6224,11 +6535,13 @@
    <dt id="biblio-css-fonts-3">[CSS-FONTS-3]
    <dd>John Daggett. <a href="https://www.w3.org/TR/css-fonts-3/">CSS Fonts Module Level 3</a>. URL: <a href="https://www.w3.org/TR/css-fonts-3/">https://www.w3.org/TR/css-fonts-3/</a>
    <dt id="biblio-css-fonts-4">[CSS-FONTS-4]
-   <dd>CSS Fonts Module Level 4 URL: <a href="https://drafts.csswg.org/css-fonts-4/">https://drafts.csswg.org/css-fonts-4/</a>
+   <dd>John Daggett; Myles Maxfield. <a href="https://www.w3.org/TR/css-fonts-4/">CSS Fonts Module Level 4</a>. URL: <a href="https://www.w3.org/TR/css-fonts-4/">https://www.w3.org/TR/css-fonts-4/</a>
    <dt id="biblio-css-overflow-3">[CSS-OVERFLOW-3]
    <dd>David Baron; Florian Rivoal. <a href="https://www.w3.org/TR/css-overflow-3/">CSS Overflow Module Level 3</a>. URL: <a href="https://www.w3.org/TR/css-overflow-3/">https://www.w3.org/TR/css-overflow-3/</a>
    <dt id="biblio-css-position-3">[CSS-POSITION-3]
    <dd>Rossen Atanassov; Arron Eicholz. <a href="https://www.w3.org/TR/css-position-3/">CSS Positioned Layout Module Level 3</a>. URL: <a href="https://www.w3.org/TR/css-position-3/">https://www.w3.org/TR/css-position-3/</a>
+   <dt id="biblio-css-sizing-3">[CSS-SIZING-3]
+   <dd>Elika Etemad. <a href="https://www.w3.org/TR/css-sizing-3/">CSS Intrinsic &amp; Extrinsic Sizing Module Level 3</a>. URL: <a href="https://www.w3.org/TR/css-sizing-3/">https://www.w3.org/TR/css-sizing-3/</a>
    <dt id="biblio-css-syntax-3">[CSS-SYNTAX-3]
    <dd>Tab Atkins Jr.; Simon Sapin. <a href="https://www.w3.org/TR/css-syntax-3/">CSS Syntax Module Level 3</a>. URL: <a href="https://www.w3.org/TR/css-syntax-3/">https://www.w3.org/TR/css-syntax-3/</a>
    <dt id="biblio-css-text-3">[CSS-TEXT-3]
@@ -6238,19 +6551,19 @@
    <dt id="biblio-css-text-decor-3">[CSS-TEXT-DECOR-3]
    <dd>Elika Etemad; Koji Ishii. <a href="https://www.w3.org/TR/css-text-decor-3/">CSS Text Decoration Module Level 3</a>. URL: <a href="https://www.w3.org/TR/css-text-decor-3/">https://www.w3.org/TR/css-text-decor-3/</a>
    <dt id="biblio-css-transitions-1">[CSS-TRANSITIONS-1]
-   <dd>CSS Transitions Module Level 1 URL: <a href="https://www.w3.org/TR/css3-transitions/">https://www.w3.org/TR/css3-transitions/</a>
-   <dt id="biblio-css-ui-3">[CSS-UI-3]
-   <dd>Tantek Çelik; Florian Rivoal. <a href="https://www.w3.org/TR/css-ui-3/">CSS Basic User Interface Module Level 3 (CSS3 UI)</a>. URL: <a href="https://www.w3.org/TR/css-ui-3/">https://www.w3.org/TR/css-ui-3/</a>
+   <dd>David Baron; Dean Jackson; Brian Birtles. <a href="https://www.w3.org/TR/css-transitions-1/">CSS Transitions</a>. URL: <a href="https://www.w3.org/TR/css-transitions-1/">https://www.w3.org/TR/css-transitions-1/</a>
+   <dt id="biblio-css-ui-4">[CSS-UI-4]
+   <dd>Florian Rivoal. <a href="https://www.w3.org/TR/css-ui-4/">CSS Basic User Interface Module Level 4</a>. URL: <a href="https://www.w3.org/TR/css-ui-4/">https://www.w3.org/TR/css-ui-4/</a>
    <dt id="biblio-css-values">[CSS-VALUES]
    <dd>Tab Atkins Jr.; Elika Etemad. <a href="https://www.w3.org/TR/css-values-3/">CSS Values and Units Module Level 3</a>. URL: <a href="https://www.w3.org/TR/css-values-3/">https://www.w3.org/TR/css-values-3/</a>
    <dt id="biblio-css-writing-modes-3">[CSS-WRITING-MODES-3]
    <dd>Elika Etemad; Koji Ishii. <a href="https://www.w3.org/TR/css-writing-modes-3/">CSS Writing Modes Level 3</a>. URL: <a href="https://www.w3.org/TR/css-writing-modes-3/">https://www.w3.org/TR/css-writing-modes-3/</a>
    <dt id="biblio-css-writing-modes-4">[CSS-WRITING-MODES-4]
-   <dd>CSS Writing Modes Module Level 4 URL: <a href="https://drafts.csswg.org/css-writing-modes-4/">https://drafts.csswg.org/css-writing-modes-4/</a>
+   <dd>Elika Etemad; Koji Ishii. <a href="https://www.w3.org/TR/css-writing-modes-4/">CSS Writing Modes Level 4</a>. URL: <a href="https://www.w3.org/TR/css-writing-modes-4/">https://www.w3.org/TR/css-writing-modes-4/</a>
    <dt id="biblio-css22">[CSS22]
    <dd>Bert Bos. <a href="https://www.w3.org/TR/CSS22/">Cascading Style Sheets Level 2 Revision 2 (CSS 2.2) Specification</a>. URL: <a href="https://www.w3.org/TR/CSS22/">https://www.w3.org/TR/CSS22/</a>
    <dt id="biblio-css3-color">[CSS3-COLOR]
-   <dd>Tantek Çelik; Chris Lilley; David Baron. <a href="https://www.w3.org/TR/css3-color">CSS Color Module Level 3</a>. 7 June 2011. REC. URL: <a href="https://www.w3.org/TR/css3-color">https://www.w3.org/TR/css3-color</a>
+   <dd>Tantek Çelik; Chris Lilley; David Baron. <a href="https://www.w3.org/TR/css-color-3/">CSS Color Module Level 3</a>. 5 December 2017. CR. URL: <a href="https://www.w3.org/TR/css-color-3/">https://www.w3.org/TR/css-color-3/</a>
    <dt id="biblio-css3-ruby">[CSS3-RUBY]
    <dd>Elika Etemad; Koji Ishii. <a href="https://www.w3.org/TR/css-ruby-1/">CSS Ruby Layout Module Level 1</a>. URL: <a href="https://www.w3.org/TR/css-ruby-1/">https://www.w3.org/TR/css-ruby-1/</a>
    <dt id="biblio-cssom">[CSSOM]
@@ -6259,6 +6572,8 @@
    <dd>Anne van Kesteren; et al. <a href="https://www.w3.org/TR/2015/REC-dom-20151119/">W3C DOM4</a>. 19 November 2015. REC. URL: <a href="https://www.w3.org/TR/2015/REC-dom-20151119/">https://www.w3.org/TR/2015/REC-dom-20151119/</a>
    <dt id="biblio-encoding-cr">[ENCODING-CR]
    <dd>Anne van Kesteren; Joshua Bell; Addison Phillips. <a href="https://www.w3.org/TR/2017/CR-encoding-20170413/">Encoding</a>. 13 April 2017. CR. URL: <a href="https://www.w3.org/TR/2017/CR-encoding-20170413/">https://www.w3.org/TR/2017/CR-encoding-20170413/</a>
+   <dt id="biblio-html">[HTML]
+   <dd>Anne van Kesteren; et al. <a href="https://html.spec.whatwg.org/multipage/">HTML Standard</a>. Living Standard. URL: <a href="https://html.spec.whatwg.org/multipage/">https://html.spec.whatwg.org/multipage/</a>
    <dt id="biblio-html51">[HTML51]
    <dd>Steve Faulkner; et al. <a href="https://www.w3.org/TR/html51/">HTML 5.1 2nd Edition</a>. URL: <a href="https://www.w3.org/TR/html51/">https://www.w3.org/TR/html51/</a>
    <dt id="biblio-rfc2119">[RFC2119]
@@ -6266,11 +6581,11 @@
    <dt id="biblio-rfc3629">[RFC3629]
    <dd>F. Yergeau. <a href="https://tools.ietf.org/html/rfc3629">UTF-8, a transformation format of ISO 10646</a>. November 2003. Internet Standard. URL: <a href="https://tools.ietf.org/html/rfc3629">https://tools.ietf.org/html/rfc3629</a>
    <dt id="biblio-selectors-3">[SELECTORS-3]
-   <dd>Selectors Level 3 URL: <a href="https://www.w3.org/TR/css3-selectors/">https://www.w3.org/TR/css3-selectors/</a>
+   <dd>Tantek Çelik; et al. <a href="https://www.w3.org/TR/selectors-3/">Selectors Level 3</a>. URL: <a href="https://www.w3.org/TR/selectors-3/">https://www.w3.org/TR/selectors-3/</a>
-   <dt id="biblio-selectors-4">[SELECTORS-4]
-   <dd>Selectors Level 4 URL: <a href="https://www.w3.org/TR/selectors4/">https://www.w3.org/TR/selectors4/</a>
    <dt id="biblio-selectors4">[SELECTORS4]
-   <dd>Elika Etemad; Tab Atkins Jr.. <a href="https://www.w3.org/TR/selectors4/">Selectors Level 4</a>. 2 May 2013. WD. URL: <a href="https://www.w3.org/TR/selectors4/">https://www.w3.org/TR/selectors4/</a>
+   <dd>Elika Etemad; Tab Atkins Jr.. <a href="https://www.w3.org/TR/selectors-4/">Selectors Level 4</a>. URL: <a href="https://www.w3.org/TR/selectors-4/">https://www.w3.org/TR/selectors-4/</a>
+   <dt id="biblio-webidl">[WebIDL]
+   <dd>Cameron McCormack; Boris Zbarsky; Tobie Langel. <a href="https://heycam.github.io/webidl/">Web IDL</a>. URL: <a href="https://heycam.github.io/webidl/">https://heycam.github.io/webidl/</a>
    <dt id="biblio-webidl-1">[WEBIDL-1]
    <dd>Cameron McCormack. <a href="https://www.w3.org/TR/2016/REC-WebIDL-1-20161215/">WebIDL Level 1</a>. URL: <a href="https://www.w3.org/TR/2016/REC-WebIDL-1-20161215/">https://www.w3.org/TR/2016/REC-WebIDL-1-20161215/</a>
   </dl>
@@ -6278,6 +6593,8 @@
   <dl>
    <dt id="biblio-maur">[MAUR]
    <dd>Shane McCarron; Michael Cooper; Mark Sadecki. <a href="http://www.w3.org/TR/media-accessibility-reqs/">Media Accessibility User Requirements</a>. WD. URL: <a href="http://www.w3.org/TR/media-accessibility-reqs/">http://www.w3.org/TR/media-accessibility-reqs/</a>
+   <dt id="biblio-wcag20">[WCAG20]
+   <dd>Ben Caldwell; et al. <a href="https://www.w3.org/TR/WCAG20/">Web Content Accessibility Guidelines (WCAG) 2.0</a>. 11 December 2008. REC. URL: <a href="https://www.w3.org/TR/WCAG20/">https://www.w3.org/TR/WCAG20/</a>
   </dl>
   <h2 class="no-num no-ref heading settled" id="idl-index"><span class="content">IDL Index</span><a class="self-link" href="#idl-index"></a></h2>
 <pre class="idl highlight def"><span class="kt">enum</span> <a class="nv" href="#enumdef-autokeyword"><code>AutoKeyword</code></a> { <a class="s" href="#dom-autokeyword-auto"><code>"auto"</code></a> };
@@ -6286,7 +6603,8 @@
 <span class="kt">enum</span> <a class="nv" href="#enumdef-linealignsetting"><code>LineAlignSetting</code></a> { <a class="s" href="#dom-linealignsetting-start"><code>"start"</code></a>, <a class="s" href="#dom-linealignsetting-center"><code>"center"</code></a>, <a class="s" href="#dom-linealignsetting-end"><code>"end"</code></a> };
 <span class="kt">enum</span> <a class="nv" href="#enumdef-positionalignsetting"><code>PositionAlignSetting</code></a> { <a class="s" href="#dom-positionalignsetting-line-left"><code>"line-left"</code></a>, <a class="s" href="#dom-positionalignsetting-center"><code>"center"</code></a>, <a class="s" href="#dom-positionalignsetting-line-right"><code>"line-right"</code></a>, <a class="s" href="#dom-positionalignsetting-auto"><code>"auto"</code></a> };
 <span class="kt">enum</span> <a class="nv" href="#enumdef-alignsetting"><code>AlignSetting</code></a> { <a class="s" href="#dom-alignsetting-start"><code>"start"</code></a>, <a class="s" href="#dom-alignsetting-center"><code>"center"</code></a>, <a class="s" href="#dom-alignsetting-end"><code>"end"</code></a>, <a class="s" href="#dom-alignsetting-left"><code>"left"</code></a>, <a class="s" href="#dom-alignsetting-right"><code>"right"</code></a> };
-[<a class="nv idl-code" data-link-type="constructor" href="#dom-vttcue-vttcue">Constructor</a>(<a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-double"><span class="kt">double</span></a> <a class="nv" href="#dom-vttcue-vttcue-starttime-endtime-text-starttime"><code>startTime</code></a>, <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-double"><span class="kt">double</span></a> <a class="nv" href="#dom-vttcue-vttcue-starttime-endtime-text-endtime"><code>endTime</code></a>, <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-DOMString"><span class="kt">DOMString</span></a> <a class="nv" href="#dom-vttcue-vttcue-starttime-endtime-text-text"><code>text</code></a>)]
+[<a class="nv idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed">Exposed</a>=<span class="n">Window</span>,
+ <a class="nv idl-code" data-link-type="constructor" href="#dom-vttcue-vttcue">Constructor</a>(<a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-double"><span class="kt">double</span></a> <a class="nv" href="#dom-vttcue-vttcue-starttime-endtime-text-starttime"><code>startTime</code></a>, <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-double"><span class="kt">double</span></a> <a class="nv" href="#dom-vttcue-vttcue-starttime-endtime-text-endtime"><code>endTime</code></a>, <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-DOMString"><span class="kt">DOMString</span></a> <a class="nv" href="#dom-vttcue-vttcue-starttime-endtime-text-text"><code>text</code></a>)]
 <span class="kt">interface</span> <a class="nv" href="#vttcue"><code>VTTCue</code></a> : <a class="n" data-link-type="idl-name" href="https://www.w3.org/TR/html51/semantics-embedded-content.html#texttrackcue-texttrackcue">TextTrackCue</a> {
   <span class="kt">attribute</span> <a class="n" data-link-type="idl-name" href="#vttregion">VTTRegion</a>? <a class="nv idl-code" data-link-type="attribute" data-type="VTTRegion?" href="#dom-vttcue-region">region</a>;
   <span class="kt">attribute</span> <a class="n" data-link-type="idl-name" href="#enumdef-directionsetting">DirectionSetting</a> <a class="nv idl-code" data-link-type="attribute" data-type="DirectionSetting" href="#dom-vttcue-vertical">vertical</a>;
@@ -6302,11 +6620,12 @@
 };
 <span class="kt">enum</span> <a class="nv" href="#enumdef-scrollsetting"><code>ScrollSetting</code></a> { <a class="s" href="#dom-scrollsetting"><code>""</code></a> /* none */, <a class="s" href="#dom-scrollsetting-up"><code>"up"</code></a> };
-[<a class="nv idl-code" data-link-type="constructor" href="#dom-vttregion-vttregion">Constructor</a>]
+[<a class="nv idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed">Exposed</a>=<span class="n">Window</span>,
+ <a class="nv idl-code" data-link-type="constructor" href="#dom-vttregion-vttregion">Constructor</a>]
 <span class="kt">interface</span> <a class="nv" href="#vttregion"><code>VTTRegion</code></a> {
   <span class="kt">attribute</span> <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-DOMString"><span class="kt">DOMString</span></a> <a class="nv idl-code" data-link-type="attribute" data-type="DOMString" href="#dom-vttregion-id">id</a>;
   <span class="kt">attribute</span> <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-double"><span class="kt">double</span></a> <a class="nv idl-code" data-link-type="attribute" data-type="double" href="#dom-vttregion-width">width</a>;
-  <span class="kt">attribute</span> <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-long"><span class="kt">long</span></a> <a class="nv idl-code" data-link-type="attribute" data-type="long" href="#dom-vttregion-lines">lines</a>;
+  <span class="kt">attribute</span> <a class="n idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><span class="kt">unsigned</span> <span class="kt">long</span></a> <a class="nv idl-code" data-link-type="attribute" data-type="unsigned long" href="#dom-vttregion-lines">lines</a>;
   <span class="kt">attribute</span> <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-double"><span class="kt">double</span></a> <a class="nv idl-code" data-link-type="attribute" data-type="double" href="#dom-vttregion-regionanchorx">regionAnchorX</a>;
   <span class="kt">attribute</span> <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-double"><span class="kt">double</span></a> <a class="nv idl-code" data-link-type="attribute" data-type="double" href="#dom-vttregion-regionanchory">regionAnchorY</a>;
   <span class="kt">attribute</span> <a class="n idl-code" data-link-type="interface" href="https://www.w3.org/TR/WebIDL-1/#idl-double"><span class="kt">double</span></a> <a class="nv idl-code" data-link-type="attribute" data-type="double" href="#dom-vttregion-viewportanchorx">viewportAnchorX</a>;
@@ -6321,400 +6640,434 @@
     <li><a href="#ref-for-webvtt-1">2.1. Conformance classes</a>
    </ul>
   </aside>
+  <aside class="dfn-panel" data-for="user-agents-that-do-not-support-css">
+   <b><a href="#user-agents-that-do-not-support-css">#user-agents-that-do-not-support-css</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-user-agents-that-do-not-support-css-1">7. Rendering</a>
+    <li><a href="#ref-for-user-agents-that-do-not-support-css-2">8. CSS extensions</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="user-agents-that-do-not-support-a-full-html-css-engine">
+   <b><a href="#user-agents-that-do-not-support-a-full-html-css-engine">#user-agents-that-do-not-support-a-full-html-css-engine</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-user-agents-that-do-not-support-a-full-html-css-engine-1">2.1. Conformance classes</a>
+    <li><a href="#ref-for-user-agents-that-do-not-support-a-full-html-css-engine-2">7. Rendering</a>
+   </ul>
+  </aside>
   <aside class="dfn-panel" data-for="webvtt-cue">
    <b><a href="#webvtt-cue">#webvtt-cue</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-2">(2)</a> <a href="#ref-for-webvtt-cue-3">(3)</a> <a href="#ref-for-webvtt-cue-4">(4)</a> <a href="#ref-for-webvtt-cue-5">(5)</a> <a href="#ref-for-webvtt-cue-6">(6)</a> <a href="#ref-for-webvtt-cue-7">(7)</a> <a href="#ref-for-webvtt-cue-8">(8)</a> <a href="#ref-for-webvtt-cue-9">(9)</a> <a href="#ref-for-webvtt-cue-10">(10)</a> <a href="#ref-for-webvtt-cue-11">(11)</a>
-    <li><a href="#ref-for-webvtt-cue-12">3.2. WebVTT regions</a>
-    <li><a href="#ref-for-webvtt-cue-13">4.1. WebVTT file structure</a>
-    <li><a href="#ref-for-webvtt-cue-14">5.1. WebVTT file parsing</a> <a href="#ref-for-webvtt-cue-15">(2)</a> <a href="#ref-for-webvtt-cue-16">(3)</a> <a href="#ref-for-webvtt-cue-17">(4)</a> <a href="#ref-for-webvtt-cue-18">(5)</a>
-    <li><a href="#ref-for-webvtt-cue-19">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-20">5.5. WebVTT cue text DOM construction rules</a>
-    <li><a href="#ref-for-webvtt-cue-21">5.6. WebVTT rules for extracting the chapter
+    <li><a href="#ref-for-webvtt-cue-1">1.1. A simple caption file</a>
+    <li><a href="#ref-for-webvtt-cue-2">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-3">(2)</a> <a href="#ref-for-webvtt-cue-4">(3)</a> <a href="#ref-for-webvtt-cue-5">(4)</a> <a href="#ref-for-webvtt-cue-6">(5)</a> <a href="#ref-for-webvtt-cue-7">(6)</a> <a href="#ref-for-webvtt-cue-8">(7)</a> <a href="#ref-for-webvtt-cue-9">(8)</a> <a href="#ref-for-webvtt-cue-10">(9)</a> <a href="#ref-for-webvtt-cue-11">(10)</a> <a href="#ref-for-webvtt-cue-12">(11)</a> <a href="#ref-for-webvtt-cue-13">(12)</a>
+    <li><a href="#ref-for-webvtt-cue-14">3.5. WebVTT chapter cues</a>
+    <li><a href="#ref-for-webvtt-cue-15">3.6. WebVTT metadata cues</a>
+    <li><a href="#ref-for-webvtt-cue-16">4.1. WebVTT file structure</a>
+    <li><a href="#ref-for-webvtt-cue-17">4.3. WebVTT region settings</a>
+    <li><a href="#ref-for-webvtt-cue-18">6.1. WebVTT file parsing</a> <a href="#ref-for-webvtt-cue-19">(2)</a> <a href="#ref-for-webvtt-cue-20">(3)</a> <a href="#ref-for-webvtt-cue-21">(4)</a> <a href="#ref-for-webvtt-cue-22">(5)</a>
+    <li><a href="#ref-for-webvtt-cue-23">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-cue-24">6.5. WebVTT cue text DOM construction rules</a>
+    <li><a href="#ref-for-webvtt-cue-25">6.6. WebVTT rules for extracting the chapter
 title</a>
-    <li><a href="#ref-for-webvtt-cue-22">6.1. Processing model</a> <a href="#ref-for-webvtt-cue-23">(2)</a>
-    <li><a href="#ref-for-webvtt-cue-24">6.1.1. Applying CSS properties to WebVTT Node Objects</a> <a href="#ref-for-webvtt-cue-25">(2)</a>
-    <li><a href="#ref-for-webvtt-cue-26">7.2. Processing model</a> <a href="#ref-for-webvtt-cue-27">(2)</a> <a href="#ref-for-webvtt-cue-28">(3)</a>
-    <li><a href="#ref-for-webvtt-cue-29">7.2.2. The :past and :future pseudo-classes</a> <a href="#ref-for-webvtt-cue-30">(2)</a>
-    <li><a href="#ref-for-webvtt-cue-31">7.2.3. The ::cue-region pseudo-element</a>
-    <li><a href="#ref-for-webvtt-cue-32">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-33">(2)</a> <a href="#ref-for-webvtt-cue-34">(3)</a> <a href="#ref-for-webvtt-cue-35">(4)</a> <a href="#ref-for-webvtt-cue-36">(5)</a> <a href="#ref-for-webvtt-cue-37">(6)</a> <a href="#ref-for-webvtt-cue-38">(7)</a> <a href="#ref-for-webvtt-cue-39">(8)</a> <a href="#ref-for-webvtt-cue-40">(9)</a> <a href="#ref-for-webvtt-cue-41">(10)</a> <a href="#ref-for-webvtt-cue-42">(11)</a> <a href="#ref-for-webvtt-cue-43">(12)</a>
+    <li><a href="#ref-for-webvtt-cue-26">7.1. Processing model</a> <a href="#ref-for-webvtt-cue-27">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-28">7.4. Applying CSS properties to WebVTT Node Objects</a> <a href="#ref-for-webvtt-cue-29">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-30">8.2. Processing model</a> <a href="#ref-for-webvtt-cue-31">(2)</a> <a href="#ref-for-webvtt-cue-32">(3)</a>
+    <li><a href="#ref-for-webvtt-cue-33">8.2.2. The :past and :future pseudo-classes</a> <a href="#ref-for-webvtt-cue-34">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-35">8.2.3. The ::cue-region pseudo-element</a>
+    <li><a href="#ref-for-webvtt-cue-36">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-37">(2)</a> <a href="#ref-for-webvtt-cue-38">(3)</a> <a href="#ref-for-webvtt-cue-39">(4)</a> <a href="#ref-for-webvtt-cue-40">(5)</a> <a href="#ref-for-webvtt-cue-41">(6)</a> <a href="#ref-for-webvtt-cue-42">(7)</a> <a href="#ref-for-webvtt-cue-43">(8)</a> <a href="#ref-for-webvtt-cue-44">(9)</a> <a href="#ref-for-webvtt-cue-45">(10)</a> <a href="#ref-for-webvtt-cue-46">(11)</a> <a href="#ref-for-webvtt-cue-47">(12)</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="cue-text">
+   <b><a href="#cue-text">#cue-text</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-cue-text-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-cue-text-2">(2)</a> <a href="#ref-for-cue-text-3">(3)</a>
+    <li><a href="#ref-for-cue-text-4">3.5. WebVTT chapter cues</a>
+    <li><a href="#ref-for-cue-text-5">3.6. WebVTT metadata cues</a>
+    <li><a href="#ref-for-cue-text-6">4.2.3. WebVTT chapter title text</a>
+    <li><a href="#ref-for-cue-text-7">6.1. WebVTT file parsing</a> <a href="#ref-for-cue-text-8">(2)</a>
+    <li><a href="#ref-for-cue-text-9">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-cue-text-10">(2)</a>
+    <li><a href="#ref-for-cue-text-11">6.6. WebVTT rules for extracting the chapter
+title</a>
+    <li><a href="#ref-for-cue-text-12">7.1. Processing model</a>
+    <li><a href="#ref-for-cue-text-13">7.4. Applying CSS properties to WebVTT Node Objects</a>
+    <li><a href="#ref-for-cue-text-14">9.1. The VTTCue interface</a> <a href="#ref-for-cue-text-15">(2)</a> <a href="#ref-for-cue-text-16">(3)</a> <a href="#ref-for-cue-text-17">(4)</a> <a href="#ref-for-cue-text-18">(5)</a> <a href="#ref-for-cue-text-19">(6)</a> <a href="#ref-for-cue-text-20">(7)</a> <a href="#ref-for-cue-text-21">(8)</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="text-track-cue-text">
-   <b><a href="#text-track-cue-text">#text-track-cue-text</a></b><b>Referenced in:</b>
-   <ul>
-    <li><a href="#ref-for-text-track-cue-text-1">3.1. WebVTT cues</a>
-    <li><a href="#ref-for-text-track-cue-text-2">5.1. WebVTT file parsing</a> <a href="#ref-for-text-track-cue-text-3">(2)</a>
+  <aside class="dfn-panel" data-for="webvtt-caption-or-subtitle-cue">
+   <b><a href="#webvtt-caption-or-subtitle-cue">#webvtt-caption-or-subtitle-cue</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-webvtt-caption-or-subtitle-cue-1">3.4. WebVTT caption or subtitle regions</a>
+    <li><a href="#ref-for-webvtt-caption-or-subtitle-cue-2">7. Rendering</a>
-    <li><a href="#ref-for-text-track-cue-text-4">5.6. WebVTT rules for extracting the chapter
-title</a>
-    <li><a href="#ref-for-text-track-cue-text-5">6.1. Processing model</a>
-    <li><a href="#ref-for-text-track-cue-text-6">6.1.1. Applying CSS properties to WebVTT Node Objects</a>
-    <li><a href="#ref-for-text-track-cue-text-7">8.1. The VTTCue interface</a> <a href="#ref-for-text-track-cue-text-8">(2)</a> <a href="#ref-for-text-track-cue-text-9">(3)</a> <a href="#ref-for-text-track-cue-text-10">(4)</a> <a href="#ref-for-text-track-cue-text-11">(5)</a> <a href="#ref-for-text-track-cue-text-12">(6)</a> <a href="#ref-for-text-track-cue-text-13">(7)</a> <a href="#ref-for-text-track-cue-text-14">(8)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-box">
    <b><a href="#webvtt-cue-box">#webvtt-cue-box</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-box-1">1.4. Other features</a> <a href="#ref-for-webvtt-cue-box-2">(2)</a> <a href="#ref-for-webvtt-cue-box-3">(3)</a> <a href="#ref-for-webvtt-cue-box-4">(4)</a> <a href="#ref-for-webvtt-cue-box-5">(5)</a>
-    <li><a href="#ref-for-webvtt-cue-box-6">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-box-7">(2)</a> <a href="#ref-for-webvtt-cue-box-8">(3)</a> <a href="#ref-for-webvtt-cue-box-9">(4)</a> <a href="#ref-for-webvtt-cue-box-10">(5)</a> <a href="#ref-for-webvtt-cue-box-11">(6)</a> <a href="#ref-for-webvtt-cue-box-12">(7)</a> <a href="#ref-for-webvtt-cue-box-13">(8)</a> <a href="#ref-for-webvtt-cue-box-14">(9)</a> <a href="#ref-for-webvtt-cue-box-15">(10)</a> <a href="#ref-for-webvtt-cue-box-16">(11)</a> <a href="#ref-for-webvtt-cue-box-17">(12)</a> <a href="#ref-for-webvtt-cue-box-18">(13)</a> <a href="#ref-for-webvtt-cue-box-19">(14)</a> <a href="#ref-for-webvtt-cue-box-20">(15)</a> <a href="#ref-for-webvtt-cue-box-21">(16)</a> <a href="#ref-for-webvtt-cue-box-22">(17)</a> <a href="#ref-for-webvtt-cue-box-23">(18)</a>
+    <li><a href="#ref-for-webvtt-cue-box-1">1.4. Other caption and subtitling features</a> <a href="#ref-for-webvtt-cue-box-2">(2)</a> <a href="#ref-for-webvtt-cue-box-3">(3)</a> <a href="#ref-for-webvtt-cue-box-4">(4)</a> <a href="#ref-for-webvtt-cue-box-5">(5)</a>
+    <li><a href="#ref-for-webvtt-cue-box-6">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-box-7">(2)</a> <a href="#ref-for-webvtt-cue-box-8">(3)</a> <a href="#ref-for-webvtt-cue-box-9">(4)</a> <a href="#ref-for-webvtt-cue-box-10">(5)</a> <a href="#ref-for-webvtt-cue-box-11">(6)</a> <a href="#ref-for-webvtt-cue-box-12">(7)</a> <a href="#ref-for-webvtt-cue-box-13">(8)</a> <a href="#ref-for-webvtt-cue-box-14">(9)</a> <a href="#ref-for-webvtt-cue-box-15">(10)</a> <a href="#ref-for-webvtt-cue-box-16">(11)</a> <a href="#ref-for-webvtt-cue-box-17">(12)</a> <a href="#ref-for-webvtt-cue-box-18">(13)</a> <a href="#ref-for-webvtt-cue-box-19">(14)</a> <a href="#ref-for-webvtt-cue-box-20">(15)</a> <a href="#ref-for-webvtt-cue-box-21">(16)</a> <a href="#ref-for-webvtt-cue-box-22">(17)</a> <a href="#ref-for-webvtt-cue-box-23">(18)</a>
     <li><a href="#ref-for-webvtt-cue-box-24">4.4. WebVTT cue settings</a> <a href="#ref-for-webvtt-cue-box-25">(2)</a> <a href="#ref-for-webvtt-cue-box-26">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-writing-direction">
    <b><a href="#webvtt-cue-writing-direction">#webvtt-cue-writing-direction</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-writing-direction-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-writing-direction-2">(2)</a> <a href="#ref-for-webvtt-cue-writing-direction-3">(3)</a> <a href="#ref-for-webvtt-cue-writing-direction-4">(4)</a> <a href="#ref-for-webvtt-cue-writing-direction-5">(5)</a> <a href="#ref-for-webvtt-cue-writing-direction-6">(6)</a> <a href="#ref-for-webvtt-cue-writing-direction-7">(7)</a> <a href="#ref-for-webvtt-cue-writing-direction-8">(8)</a> <a href="#ref-for-webvtt-cue-writing-direction-9">(9)</a> <a href="#ref-for-webvtt-cue-writing-direction-10">(10)</a> <a href="#ref-for-webvtt-cue-writing-direction-11">(11)</a>
+    <li><a href="#ref-for-webvtt-cue-writing-direction-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-writing-direction-2">(2)</a> <a href="#ref-for-webvtt-cue-writing-direction-3">(3)</a> <a href="#ref-for-webvtt-cue-writing-direction-4">(4)</a> <a href="#ref-for-webvtt-cue-writing-direction-5">(5)</a> <a href="#ref-for-webvtt-cue-writing-direction-6">(6)</a> <a href="#ref-for-webvtt-cue-writing-direction-7">(7)</a> <a href="#ref-for-webvtt-cue-writing-direction-8">(8)</a> <a href="#ref-for-webvtt-cue-writing-direction-9">(9)</a> <a href="#ref-for-webvtt-cue-writing-direction-10">(10)</a> <a href="#ref-for-webvtt-cue-writing-direction-11">(11)</a>
     <li><a href="#ref-for-webvtt-cue-writing-direction-12">4.4. WebVTT cue settings</a>
-    <li><a href="#ref-for-webvtt-cue-writing-direction-13">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-cue-writing-direction-14">5.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-webvtt-cue-writing-direction-15">(2)</a>
-    <li><a href="#ref-for-webvtt-cue-writing-direction-16">6.1. Processing model</a> <a href="#ref-for-webvtt-cue-writing-direction-17">(2)</a> <a href="#ref-for-webvtt-cue-writing-direction-18">(3)</a> <a href="#ref-for-webvtt-cue-writing-direction-19">(4)</a> <a href="#ref-for-webvtt-cue-writing-direction-20">(5)</a> <a href="#ref-for-webvtt-cue-writing-direction-21">(6)</a> <a href="#ref-for-webvtt-cue-writing-direction-22">(7)</a> <a href="#ref-for-webvtt-cue-writing-direction-23">(8)</a> <a href="#ref-for-webvtt-cue-writing-direction-24">(9)</a> <a href="#ref-for-webvtt-cue-writing-direction-25">(10)</a> <a href="#ref-for-webvtt-cue-writing-direction-26">(11)</a> <a href="#ref-for-webvtt-cue-writing-direction-27">(12)</a> <a href="#ref-for-webvtt-cue-writing-direction-28">(13)</a> <a href="#ref-for-webvtt-cue-writing-direction-29">(14)</a> <a href="#ref-for-webvtt-cue-writing-direction-30">(15)</a> <a href="#ref-for-webvtt-cue-writing-direction-31">(16)</a> <a href="#ref-for-webvtt-cue-writing-direction-32">(17)</a> <a href="#ref-for-webvtt-cue-writing-direction-33">(18)</a> <a href="#ref-for-webvtt-cue-writing-direction-34">(19)</a>
-    <li><a href="#ref-for-webvtt-cue-writing-direction-35">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-writing-direction-36">(2)</a> <a href="#ref-for-webvtt-cue-writing-direction-37">(3)</a> <a href="#ref-for-webvtt-cue-writing-direction-38">(4)</a> <a href="#ref-for-webvtt-cue-writing-direction-39">(5)</a>
+    <li><a href="#ref-for-webvtt-cue-writing-direction-13">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-cue-writing-direction-14">6.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-webvtt-cue-writing-direction-15">(2)</a> <a href="#ref-for-webvtt-cue-writing-direction-16">(3)</a>
+    <li><a href="#ref-for-webvtt-cue-writing-direction-17">7.2. Processing cue settings</a> <a href="#ref-for-webvtt-cue-writing-direction-18">(2)</a> <a href="#ref-for-webvtt-cue-writing-direction-19">(3)</a> <a href="#ref-for-webvtt-cue-writing-direction-20">(4)</a> <a href="#ref-for-webvtt-cue-writing-direction-21">(5)</a> <a href="#ref-for-webvtt-cue-writing-direction-22">(6)</a> <a href="#ref-for-webvtt-cue-writing-direction-23">(7)</a> <a href="#ref-for-webvtt-cue-writing-direction-24">(8)</a> <a href="#ref-for-webvtt-cue-writing-direction-25">(9)</a> <a href="#ref-for-webvtt-cue-writing-direction-26">(10)</a> <a href="#ref-for-webvtt-cue-writing-direction-27">(11)</a> <a href="#ref-for-webvtt-cue-writing-direction-28">(12)</a> <a href="#ref-for-webvtt-cue-writing-direction-29">(13)</a> <a href="#ref-for-webvtt-cue-writing-direction-30">(14)</a> <a href="#ref-for-webvtt-cue-writing-direction-31">(15)</a> <a href="#ref-for-webvtt-cue-writing-direction-32">(16)</a> <a href="#ref-for-webvtt-cue-writing-direction-33">(17)</a>
+    <li><a href="#ref-for-webvtt-cue-writing-direction-34">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-writing-direction-35">(2)</a> <a href="#ref-for-webvtt-cue-writing-direction-36">(3)</a> <a href="#ref-for-webvtt-cue-writing-direction-37">(4)</a> <a href="#ref-for-webvtt-cue-writing-direction-38">(5)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-horizontal-writing-direction">
    <b><a href="#webvtt-cue-horizontal-writing-direction">#webvtt-cue-horizontal-writing-direction</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-horizontal-writing-direction-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-2">(2)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-3">(3)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-4">(4)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-5">(5)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-6">(6)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-7">(7)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-8">(8)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-9">(9)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-10">(10)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-11">(11)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-12">(12)</a>
-    <li><a href="#ref-for-webvtt-cue-horizontal-writing-direction-13">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-cue-horizontal-writing-direction-14">6.1. Processing model</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-15">(2)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-16">(3)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-17">(4)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-18">(5)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-19">(6)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-20">(7)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-21">(8)</a>
-    <li><a href="#ref-for-webvtt-cue-horizontal-writing-direction-22">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-23">(2)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-24">(3)</a>
+    <li><a href="#ref-for-webvtt-cue-horizontal-writing-direction-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-2">(2)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-3">(3)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-4">(4)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-5">(5)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-6">(6)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-7">(7)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-8">(8)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-9">(9)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-10">(10)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-11">(11)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-12">(12)</a>
+    <li><a href="#ref-for-webvtt-cue-horizontal-writing-direction-13">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-cue-horizontal-writing-direction-14">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-cue-horizontal-writing-direction-15">7.2. Processing cue settings</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-16">(2)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-17">(3)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-18">(4)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-19">(5)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-20">(6)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-21">(7)</a>
+    <li><a href="#ref-for-webvtt-cue-horizontal-writing-direction-22">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-23">(2)</a> <a href="#ref-for-webvtt-cue-horizontal-writing-direction-24">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-vertical-growing-left-writing-direction">
    <b><a href="#webvtt-cue-vertical-growing-left-writing-direction">#webvtt-cue-vertical-growing-left-writing-direction</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-2">(2)</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-3">(3)</a>
-    <li><a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-4">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-5">6.1. Processing model</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-6">(2)</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-7">(3)</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-8">(4)</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-9">(5)</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-10">(6)</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-11">(7)</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-12">(8)</a>
-    <li><a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-13">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-14">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-2">(2)</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-3">(3)</a>
+    <li><a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-4">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-5">7.2. Processing cue settings</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-6">(2)</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-7">(3)</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-8">(4)</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-9">(5)</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-10">(6)</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-11">(7)</a>
+    <li><a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-12">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-vertical-growing-left-writing-direction-13">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-vertical-growing-right-writing-direction">
    <b><a href="#webvtt-cue-vertical-growing-right-writing-direction">#webvtt-cue-vertical-growing-right-writing-direction</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-2">(2)</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-3">(3)</a>
-    <li><a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-4">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-5">6.1. Processing model</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-6">(2)</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-7">(3)</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-8">(4)</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-9">(5)</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-10">(6)</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-11">(7)</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-12">(8)</a>
-    <li><a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-13">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-14">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-2">(2)</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-3">(3)</a>
+    <li><a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-4">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-5">7.2. Processing cue settings</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-6">(2)</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-7">(3)</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-8">(4)</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-9">(5)</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-10">(6)</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-11">(7)</a>
+    <li><a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-12">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-vertical-growing-right-writing-direction-13">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-snap-to-lines-flag">
    <b><a href="#webvtt-cue-snap-to-lines-flag">#webvtt-cue-snap-to-lines-flag</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-snap-to-lines-flag-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-2">(2)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-3">(3)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-4">(4)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-5">(5)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-6">(6)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-7">(7)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-8">(8)</a>
-    <li><a href="#ref-for-webvtt-cue-snap-to-lines-flag-9">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-cue-snap-to-lines-flag-10">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-snap-to-lines-flag-11">6.1. Processing model</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-12">(2)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-13">(3)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-14">(4)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-15">(5)</a>
-    <li><a href="#ref-for-webvtt-cue-snap-to-lines-flag-16">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-17">(2)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-18">(3)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-19">(4)</a>
+    <li><a href="#ref-for-webvtt-cue-snap-to-lines-flag-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-2">(2)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-3">(3)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-4">(4)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-5">(5)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-6">(6)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-7">(7)</a>
+    <li><a href="#ref-for-webvtt-cue-snap-to-lines-flag-8">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-cue-snap-to-lines-flag-9">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-cue-snap-to-lines-flag-10">7.2. Processing cue settings</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-11">(2)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-12">(3)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-13">(4)</a>
+    <li><a href="#ref-for-webvtt-cue-snap-to-lines-flag-14">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-15">(2)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-16">(3)</a> <a href="#ref-for-webvtt-cue-snap-to-lines-flag-17">(4)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-line">
    <b><a href="#webvtt-cue-line">#webvtt-cue-line</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-line-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-line-2">(2)</a> <a href="#ref-for-webvtt-cue-line-3">(3)</a> <a href="#ref-for-webvtt-cue-line-4">(4)</a> <a href="#ref-for-webvtt-cue-line-5">(5)</a> <a href="#ref-for-webvtt-cue-line-6">(6)</a> <a href="#ref-for-webvtt-cue-line-7">(7)</a> <a href="#ref-for-webvtt-cue-line-8">(8)</a> <a href="#ref-for-webvtt-cue-line-9">(9)</a> <a href="#ref-for-webvtt-cue-line-10">(10)</a> <a href="#ref-for-webvtt-cue-line-11">(11)</a> <a href="#ref-for-webvtt-cue-line-12">(12)</a> <a href="#ref-for-webvtt-cue-line-13">(13)</a> <a href="#ref-for-webvtt-cue-line-14">(14)</a> <a href="#ref-for-webvtt-cue-line-15">(15)</a> <a href="#ref-for-webvtt-cue-line-16">(16)</a> <a href="#ref-for-webvtt-cue-line-17">(17)</a> <a href="#ref-for-webvtt-cue-line-18">(18)</a> <a href="#ref-for-webvtt-cue-line-19">(19)</a> <a href="#ref-for-webvtt-cue-line-20">(20)</a>
-    <li><a href="#ref-for-webvtt-cue-line-21">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-cue-line-22">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-line-23">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-line-24">(2)</a> <a href="#ref-for-webvtt-cue-line-25">(3)</a> <a href="#ref-for-webvtt-cue-line-26">(4)</a>
+    <li><a href="#ref-for-webvtt-cue-line-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-line-2">(2)</a> <a href="#ref-for-webvtt-cue-line-3">(3)</a> <a href="#ref-for-webvtt-cue-line-4">(4)</a> <a href="#ref-for-webvtt-cue-line-5">(5)</a> <a href="#ref-for-webvtt-cue-line-6">(6)</a> <a href="#ref-for-webvtt-cue-line-7">(7)</a> <a href="#ref-for-webvtt-cue-line-8">(8)</a> <a href="#ref-for-webvtt-cue-line-9">(9)</a> <a href="#ref-for-webvtt-cue-line-10">(10)</a> <a href="#ref-for-webvtt-cue-line-11">(11)</a> <a href="#ref-for-webvtt-cue-line-12">(12)</a> <a href="#ref-for-webvtt-cue-line-13">(13)</a> <a href="#ref-for-webvtt-cue-line-14">(14)</a> <a href="#ref-for-webvtt-cue-line-15">(15)</a> <a href="#ref-for-webvtt-cue-line-16">(16)</a> <a href="#ref-for-webvtt-cue-line-17">(17)</a> <a href="#ref-for-webvtt-cue-line-18">(18)</a> <a href="#ref-for-webvtt-cue-line-19">(19)</a> <a href="#ref-for-webvtt-cue-line-20">(20)</a>
+    <li><a href="#ref-for-webvtt-cue-line-21">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-cue-line-22">6.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-webvtt-cue-line-23">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-line-24">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-line-25">(2)</a> <a href="#ref-for-webvtt-cue-line-26">(3)</a> <a href="#ref-for-webvtt-cue-line-27">(4)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-line-automatic">
    <b><a href="#webvtt-cue-line-automatic">#webvtt-cue-line-automatic</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-line-automatic-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-line-automatic-2">(2)</a> <a href="#ref-for-webvtt-cue-line-automatic-3">(3)</a>
-    <li><a href="#ref-for-webvtt-cue-line-automatic-4">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-cue-line-automatic-5">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-line-automatic-6">(2)</a> <a href="#ref-for-webvtt-cue-line-automatic-7">(3)</a> <a href="#ref-for-webvtt-cue-line-automatic-8">(4)</a>
+    <li><a href="#ref-for-webvtt-cue-line-automatic-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-line-automatic-2">(2)</a> <a href="#ref-for-webvtt-cue-line-automatic-3">(3)</a>
+    <li><a href="#ref-for-webvtt-cue-line-automatic-4">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-cue-line-automatic-5">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-cue-line-automatic-6">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-line-automatic-7">(2)</a> <a href="#ref-for-webvtt-cue-line-automatic-8">(3)</a> <a href="#ref-for-webvtt-cue-line-automatic-9">(4)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="cue-computed-line">
    <b><a href="#cue-computed-line">#cue-computed-line</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-cue-computed-line-1">3.1. WebVTT cues</a>
-    <li><a href="#ref-for-cue-computed-line-2">6.1. Processing model</a> <a href="#ref-for-cue-computed-line-3">(2)</a> <a href="#ref-for-cue-computed-line-4">(3)</a>
+    <li><a href="#ref-for-cue-computed-line-1">3.3. WebVTT caption or subtitle cues</a>
+    <li><a href="#ref-for-cue-computed-line-2">7.2. Processing cue settings</a> <a href="#ref-for-cue-computed-line-3">(2)</a> <a href="#ref-for-cue-computed-line-4">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-line-alignment">
    <b><a href="#webvtt-cue-line-alignment">#webvtt-cue-line-alignment</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-line-alignment-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-line-alignment-2">(2)</a> <a href="#ref-for-webvtt-cue-line-alignment-3">(3)</a> <a href="#ref-for-webvtt-cue-line-alignment-4">(4)</a>
+    <li><a href="#ref-for-webvtt-cue-line-alignment-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-line-alignment-2">(2)</a> <a href="#ref-for-webvtt-cue-line-alignment-3">(3)</a> <a href="#ref-for-webvtt-cue-line-alignment-4">(4)</a>
     <li><a href="#ref-for-webvtt-cue-line-alignment-5">4.4. WebVTT cue settings</a>
-    <li><a href="#ref-for-webvtt-cue-line-alignment-6">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-cue-line-alignment-7">5.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-webvtt-cue-line-alignment-8">(2)</a> <a href="#ref-for-webvtt-cue-line-alignment-9">(3)</a>
-    <li><a href="#ref-for-webvtt-cue-line-alignment-10">6.1. Processing model</a> <a href="#ref-for-webvtt-cue-line-alignment-11">(2)</a> <a href="#ref-for-webvtt-cue-line-alignment-12">(3)</a> <a href="#ref-for-webvtt-cue-line-alignment-13">(4)</a>
-    <li><a href="#ref-for-webvtt-cue-line-alignment-14">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-line-alignment-15">(2)</a> <a href="#ref-for-webvtt-cue-line-alignment-16">(3)</a> <a href="#ref-for-webvtt-cue-line-alignment-17">(4)</a> <a href="#ref-for-webvtt-cue-line-alignment-18">(5)</a>
+    <li><a href="#ref-for-webvtt-cue-line-alignment-6">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-cue-line-alignment-7">6.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-webvtt-cue-line-alignment-8">(2)</a> <a href="#ref-for-webvtt-cue-line-alignment-9">(3)</a>
+    <li><a href="#ref-for-webvtt-cue-line-alignment-10">7.2. Processing cue settings</a> <a href="#ref-for-webvtt-cue-line-alignment-11">(2)</a> <a href="#ref-for-webvtt-cue-line-alignment-12">(3)</a> <a href="#ref-for-webvtt-cue-line-alignment-13">(4)</a>
+    <li><a href="#ref-for-webvtt-cue-line-alignment-14">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-line-alignment-15">(2)</a> <a href="#ref-for-webvtt-cue-line-alignment-16">(3)</a> <a href="#ref-for-webvtt-cue-line-alignment-17">(4)</a> <a href="#ref-for-webvtt-cue-line-alignment-18">(5)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-line-start-alignment">
    <b><a href="#webvtt-cue-line-start-alignment">#webvtt-cue-line-start-alignment</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-line-start-alignment-1">3.1. WebVTT cues</a>
+    <li><a href="#ref-for-webvtt-cue-line-start-alignment-1">3.3. WebVTT caption or subtitle cues</a>
     <li><a href="#ref-for-webvtt-cue-line-start-alignment-2">4.4. WebVTT cue settings</a> <a href="#ref-for-webvtt-cue-line-start-alignment-3">(2)</a>
-    <li><a href="#ref-for-webvtt-cue-line-start-alignment-4">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-cue-line-start-alignment-5">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-line-start-alignment-6">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-line-start-alignment-7">(2)</a> <a href="#ref-for-webvtt-cue-line-start-alignment-8">(3)</a>
+    <li><a href="#ref-for-webvtt-cue-line-start-alignment-4">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-cue-line-start-alignment-5">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-cue-line-start-alignment-6">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-line-start-alignment-7">(2)</a> <a href="#ref-for-webvtt-cue-line-start-alignment-8">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-line-center-alignment">
    <b><a href="#webvtt-cue-line-center-alignment">#webvtt-cue-line-center-alignment</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-webvtt-cue-line-center-alignment-1">4.4. WebVTT cue settings</a>
-    <li><a href="#ref-for-webvtt-cue-line-center-alignment-2">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-line-center-alignment-3">6.1. Processing model</a> <a href="#ref-for-webvtt-cue-line-center-alignment-4">(2)</a>
-    <li><a href="#ref-for-webvtt-cue-line-center-alignment-5">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-line-center-alignment-6">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-line-center-alignment-2">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-cue-line-center-alignment-3">7.2. Processing cue settings</a> <a href="#ref-for-webvtt-cue-line-center-alignment-4">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-line-center-alignment-5">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-line-center-alignment-6">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-line-end-alignment">
    <b><a href="#webvtt-cue-line-end-alignment">#webvtt-cue-line-end-alignment</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-webvtt-cue-line-end-alignment-1">4.4. WebVTT cue settings</a>
-    <li><a href="#ref-for-webvtt-cue-line-end-alignment-2">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-line-end-alignment-3">6.1. Processing model</a> <a href="#ref-for-webvtt-cue-line-end-alignment-4">(2)</a>
-    <li><a href="#ref-for-webvtt-cue-line-end-alignment-5">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-line-end-alignment-6">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-line-end-alignment-2">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-cue-line-end-alignment-3">7.2. Processing cue settings</a> <a href="#ref-for-webvtt-cue-line-end-alignment-4">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-line-end-alignment-5">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-line-end-alignment-6">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-position">
    <b><a href="#webvtt-cue-position">#webvtt-cue-position</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-position-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-position-2">(2)</a> <a href="#ref-for-webvtt-cue-position-3">(3)</a> <a href="#ref-for-webvtt-cue-position-4">(4)</a> <a href="#ref-for-webvtt-cue-position-5">(5)</a> <a href="#ref-for-webvtt-cue-position-6">(6)</a> <a href="#ref-for-webvtt-cue-position-7">(7)</a> <a href="#ref-for-webvtt-cue-position-8">(8)</a> <a href="#ref-for-webvtt-cue-position-9">(9)</a> <a href="#ref-for-webvtt-cue-position-10">(10)</a> <a href="#ref-for-webvtt-cue-position-11">(11)</a> <a href="#ref-for-webvtt-cue-position-12">(12)</a> <a href="#ref-for-webvtt-cue-position-13">(13)</a> <a href="#ref-for-webvtt-cue-position-14">(14)</a> <a href="#ref-for-webvtt-cue-position-15">(15)</a> <a href="#ref-for-webvtt-cue-position-16">(16)</a> <a href="#ref-for-webvtt-cue-position-17">(17)</a> <a href="#ref-for-webvtt-cue-position-18">(18)</a> <a href="#ref-for-webvtt-cue-position-19">(19)</a>
-    <li><a href="#ref-for-webvtt-cue-position-20">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-cue-position-21">5.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-webvtt-cue-position-22">(2)</a>
-    <li><a href="#ref-for-webvtt-cue-position-23">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-position-24">(2)</a> <a href="#ref-for-webvtt-cue-position-25">(3)</a> <a href="#ref-for-webvtt-cue-position-26">(4)</a>
+    <li><a href="#ref-for-webvtt-cue-position-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-position-2">(2)</a> <a href="#ref-for-webvtt-cue-position-3">(3)</a> <a href="#ref-for-webvtt-cue-position-4">(4)</a> <a href="#ref-for-webvtt-cue-position-5">(5)</a> <a href="#ref-for-webvtt-cue-position-6">(6)</a> <a href="#ref-for-webvtt-cue-position-7">(7)</a> <a href="#ref-for-webvtt-cue-position-8">(8)</a> <a href="#ref-for-webvtt-cue-position-9">(9)</a> <a href="#ref-for-webvtt-cue-position-10">(10)</a> <a href="#ref-for-webvtt-cue-position-11">(11)</a> <a href="#ref-for-webvtt-cue-position-12">(12)</a> <a href="#ref-for-webvtt-cue-position-13">(13)</a> <a href="#ref-for-webvtt-cue-position-14">(14)</a> <a href="#ref-for-webvtt-cue-position-15">(15)</a> <a href="#ref-for-webvtt-cue-position-16">(16)</a> <a href="#ref-for-webvtt-cue-position-17">(17)</a> <a href="#ref-for-webvtt-cue-position-18">(18)</a> <a href="#ref-for-webvtt-cue-position-19">(19)</a>
+    <li><a href="#ref-for-webvtt-cue-position-20">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-cue-position-21">6.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-webvtt-cue-position-22">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-position-23">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-position-24">(2)</a> <a href="#ref-for-webvtt-cue-position-25">(3)</a> <a href="#ref-for-webvtt-cue-position-26">(4)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-automatic-position">
    <b><a href="#webvtt-cue-automatic-position">#webvtt-cue-automatic-position</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-automatic-position-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-automatic-position-2">(2)</a> <a href="#ref-for-webvtt-cue-automatic-position-3">(3)</a> <a href="#ref-for-webvtt-cue-automatic-position-4">(4)</a> <a href="#ref-for-webvtt-cue-automatic-position-5">(5)</a>
-    <li><a href="#ref-for-webvtt-cue-automatic-position-6">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-cue-automatic-position-7">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-automatic-position-8">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-automatic-position-9">(2)</a> <a href="#ref-for-webvtt-cue-automatic-position-10">(3)</a> <a href="#ref-for-webvtt-cue-automatic-position-11">(4)</a>
+    <li><a href="#ref-for-webvtt-cue-automatic-position-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-automatic-position-2">(2)</a> <a href="#ref-for-webvtt-cue-automatic-position-3">(3)</a> <a href="#ref-for-webvtt-cue-automatic-position-4">(4)</a> <a href="#ref-for-webvtt-cue-automatic-position-5">(5)</a>
+    <li><a href="#ref-for-webvtt-cue-automatic-position-6">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-cue-automatic-position-7">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-cue-automatic-position-8">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-automatic-position-9">(2)</a> <a href="#ref-for-webvtt-cue-automatic-position-10">(3)</a> <a href="#ref-for-webvtt-cue-automatic-position-11">(4)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="cue-computed-position">
    <b><a href="#cue-computed-position">#cue-computed-position</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-cue-computed-position-1">6.1. Processing model</a> <a href="#ref-for-cue-computed-position-2">(2)</a> <a href="#ref-for-cue-computed-position-3">(3)</a> <a href="#ref-for-cue-computed-position-4">(4)</a> <a href="#ref-for-cue-computed-position-5">(5)</a> <a href="#ref-for-cue-computed-position-6">(6)</a> <a href="#ref-for-cue-computed-position-7">(7)</a> <a href="#ref-for-cue-computed-position-8">(8)</a> <a href="#ref-for-cue-computed-position-9">(9)</a> <a href="#ref-for-cue-computed-position-10">(10)</a> <a href="#ref-for-cue-computed-position-11">(11)</a> <a href="#ref-for-cue-computed-position-12">(12)</a> <a href="#ref-for-cue-computed-position-13">(13)</a>
+    <li><a href="#ref-for-cue-computed-position-1">7.1. Processing model</a>
+    <li><a href="#ref-for-cue-computed-position-2">7.2. Processing cue settings</a> <a href="#ref-for-cue-computed-position-3">(2)</a> <a href="#ref-for-cue-computed-position-4">(3)</a> <a href="#ref-for-cue-computed-position-5">(4)</a> <a href="#ref-for-cue-computed-position-6">(5)</a> <a href="#ref-for-cue-computed-position-7">(6)</a> <a href="#ref-for-cue-computed-position-8">(7)</a> <a href="#ref-for-cue-computed-position-9">(8)</a> <a href="#ref-for-cue-computed-position-10">(9)</a> <a href="#ref-for-cue-computed-position-11">(10)</a> <a href="#ref-for-cue-computed-position-12">(11)</a> <a href="#ref-for-cue-computed-position-13">(12)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-position-alignment">
    <b><a href="#webvtt-cue-position-alignment">#webvtt-cue-position-alignment</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-position-alignment-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-position-alignment-2">(2)</a> <a href="#ref-for-webvtt-cue-position-alignment-3">(3)</a> <a href="#ref-for-webvtt-cue-position-alignment-4">(4)</a> <a href="#ref-for-webvtt-cue-position-alignment-5">(5)</a> <a href="#ref-for-webvtt-cue-position-alignment-6">(6)</a>
-    <li><a href="#ref-for-webvtt-cue-position-alignment-7">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-cue-position-alignment-8">5.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-webvtt-cue-position-alignment-9">(2)</a> <a href="#ref-for-webvtt-cue-position-alignment-10">(3)</a>
-    <li><a href="#ref-for-webvtt-cue-position-alignment-11">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-position-alignment-12">(2)</a> <a href="#ref-for-webvtt-cue-position-alignment-13">(3)</a> <a href="#ref-for-webvtt-cue-position-alignment-14">(4)</a> <a href="#ref-for-webvtt-cue-position-alignment-15">(5)</a>
+    <li><a href="#ref-for-webvtt-cue-position-alignment-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-position-alignment-2">(2)</a> <a href="#ref-for-webvtt-cue-position-alignment-3">(3)</a> <a href="#ref-for-webvtt-cue-position-alignment-4">(4)</a> <a href="#ref-for-webvtt-cue-position-alignment-5">(5)</a> <a href="#ref-for-webvtt-cue-position-alignment-6">(6)</a>
+    <li><a href="#ref-for-webvtt-cue-position-alignment-7">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-cue-position-alignment-8">6.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-webvtt-cue-position-alignment-9">(2)</a> <a href="#ref-for-webvtt-cue-position-alignment-10">(3)</a>
+    <li><a href="#ref-for-webvtt-cue-position-alignment-11">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-position-alignment-12">(2)</a> <a href="#ref-for-webvtt-cue-position-alignment-13">(3)</a> <a href="#ref-for-webvtt-cue-position-alignment-14">(4)</a> <a href="#ref-for-webvtt-cue-position-alignment-15">(5)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-position-line-left-alignment">
    <b><a href="#webvtt-cue-position-line-left-alignment">#webvtt-cue-position-line-left-alignment</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-position-line-left-alignment-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-position-line-left-alignment-2">(2)</a>
-    <li><a href="#ref-for-webvtt-cue-position-line-left-alignment-3">4.4. WebVTT cue settings</a>
-    <li><a href="#ref-for-webvtt-cue-position-line-left-alignment-4">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-position-line-left-alignment-5">6.1. Processing model</a> <a href="#ref-for-webvtt-cue-position-line-left-alignment-6">(2)</a> <a href="#ref-for-webvtt-cue-position-line-left-alignment-7">(3)</a>
-    <li><a href="#ref-for-webvtt-cue-position-line-left-alignment-8">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-position-line-left-alignment-9">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-position-line-left-alignment-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-position-line-left-alignment-2">(2)</a> <a href="#ref-for-webvtt-cue-position-line-left-alignment-3">(3)</a> <a href="#ref-for-webvtt-cue-position-line-left-alignment-4">(4)</a>
+    <li><a href="#ref-for-webvtt-cue-position-line-left-alignment-5">4.4. WebVTT cue settings</a>
+    <li><a href="#ref-for-webvtt-cue-position-line-left-alignment-6">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-cue-position-line-left-alignment-7">7.2. Processing cue settings</a> <a href="#ref-for-webvtt-cue-position-line-left-alignment-8">(2)</a> <a href="#ref-for-webvtt-cue-position-line-left-alignment-9">(3)</a>
+    <li><a href="#ref-for-webvtt-cue-position-line-left-alignment-10">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-position-line-left-alignment-11">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-position-center-alignment">
    <b><a href="#webvtt-cue-position-center-alignment">#webvtt-cue-position-center-alignment</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-webvtt-cue-position-center-alignment-1">4.4. WebVTT cue settings</a>
-    <li><a href="#ref-for-webvtt-cue-position-center-alignment-2">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-position-center-alignment-3">6.1. Processing model</a> <a href="#ref-for-webvtt-cue-position-center-alignment-4">(2)</a> <a href="#ref-for-webvtt-cue-position-center-alignment-5">(3)</a> <a href="#ref-for-webvtt-cue-position-center-alignment-6">(4)</a> <a href="#ref-for-webvtt-cue-position-center-alignment-7">(5)</a>
-    <li><a href="#ref-for-webvtt-cue-position-center-alignment-8">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-position-center-alignment-9">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-position-center-alignment-2">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-cue-position-center-alignment-3">7.1. Processing model</a>
+    <li><a href="#ref-for-webvtt-cue-position-center-alignment-4">7.2. Processing cue settings</a> <a href="#ref-for-webvtt-cue-position-center-alignment-5">(2)</a> <a href="#ref-for-webvtt-cue-position-center-alignment-6">(3)</a> <a href="#ref-for-webvtt-cue-position-center-alignment-7">(4)</a>
+    <li><a href="#ref-for-webvtt-cue-position-center-alignment-8">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-position-center-alignment-9">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-position-line-right-alignment">
    <b><a href="#webvtt-cue-position-line-right-alignment">#webvtt-cue-position-line-right-alignment</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-position-line-right-alignment-1">3.1. WebVTT cues</a>
-    <li><a href="#ref-for-webvtt-cue-position-line-right-alignment-2">4.4. WebVTT cue settings</a>
-    <li><a href="#ref-for-webvtt-cue-position-line-right-alignment-3">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-position-line-right-alignment-4">6.1. Processing model</a> <a href="#ref-for-webvtt-cue-position-line-right-alignment-5">(2)</a> <a href="#ref-for-webvtt-cue-position-line-right-alignment-6">(3)</a> <a href="#ref-for-webvtt-cue-position-line-right-alignment-7">(4)</a>
-    <li><a href="#ref-for-webvtt-cue-position-line-right-alignment-8">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-position-line-right-alignment-9">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-position-line-right-alignment-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-position-line-right-alignment-2">(2)</a> <a href="#ref-for-webvtt-cue-position-line-right-alignment-3">(3)</a>
+    <li><a href="#ref-for-webvtt-cue-position-line-right-alignment-4">4.4. WebVTT cue settings</a>
+    <li><a href="#ref-for-webvtt-cue-position-line-right-alignment-5">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-cue-position-line-right-alignment-6">7.1. Processing model</a>
+    <li><a href="#ref-for-webvtt-cue-position-line-right-alignment-7">7.2. Processing cue settings</a> <a href="#ref-for-webvtt-cue-position-line-right-alignment-8">(2)</a> <a href="#ref-for-webvtt-cue-position-line-right-alignment-9">(3)</a>
+    <li><a href="#ref-for-webvtt-cue-position-line-right-alignment-10">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-position-line-right-alignment-11">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-position-automatic-alignment">
    <b><a href="#webvtt-cue-position-automatic-alignment">#webvtt-cue-position-automatic-alignment</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-position-automatic-alignment-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-position-automatic-alignment-2">(2)</a>
-    <li><a href="#ref-for-webvtt-cue-position-automatic-alignment-3">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-cue-position-automatic-alignment-4">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-position-automatic-alignment-5">(2)</a> <a href="#ref-for-webvtt-cue-position-automatic-alignment-6">(3)</a>
+    <li><a href="#ref-for-webvtt-cue-position-automatic-alignment-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-position-automatic-alignment-2">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-position-automatic-alignment-3">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-cue-position-automatic-alignment-4">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-position-automatic-alignment-5">(2)</a> <a href="#ref-for-webvtt-cue-position-automatic-alignment-6">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="cue-computed-position-alignment">
    <b><a href="#cue-computed-position-alignment">#cue-computed-position-alignment</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-cue-computed-position-alignment-1">4.4. WebVTT cue settings</a>
-    <li><a href="#ref-for-cue-computed-position-alignment-2">6.1. Processing model</a> <a href="#ref-for-cue-computed-position-alignment-3">(2)</a> <a href="#ref-for-cue-computed-position-alignment-4">(3)</a> <a href="#ref-for-cue-computed-position-alignment-5">(4)</a> <a href="#ref-for-cue-computed-position-alignment-6">(5)</a> <a href="#ref-for-cue-computed-position-alignment-7">(6)</a> <a href="#ref-for-cue-computed-position-alignment-8">(7)</a> <a href="#ref-for-cue-computed-position-alignment-9">(8)</a> <a href="#ref-for-cue-computed-position-alignment-10">(9)</a> <a href="#ref-for-cue-computed-position-alignment-11">(10)</a> <a href="#ref-for-cue-computed-position-alignment-12">(11)</a> <a href="#ref-for-cue-computed-position-alignment-13">(12)</a> <a href="#ref-for-cue-computed-position-alignment-14">(13)</a>
+    <li><a href="#ref-for-cue-computed-position-alignment-2">7.1. Processing model</a> <a href="#ref-for-cue-computed-position-alignment-3">(2)</a> <a href="#ref-for-cue-computed-position-alignment-4">(3)</a>
+    <li><a href="#ref-for-cue-computed-position-alignment-5">7.2. Processing cue settings</a> <a href="#ref-for-cue-computed-position-alignment-6">(2)</a> <a href="#ref-for-cue-computed-position-alignment-7">(3)</a> <a href="#ref-for-cue-computed-position-alignment-8">(4)</a> <a href="#ref-for-cue-computed-position-alignment-9">(5)</a> <a href="#ref-for-cue-computed-position-alignment-10">(6)</a> <a href="#ref-for-cue-computed-position-alignment-11">(7)</a> <a href="#ref-for-cue-computed-position-alignment-12">(8)</a> <a href="#ref-for-cue-computed-position-alignment-13">(9)</a> <a href="#ref-for-cue-computed-position-alignment-14">(10)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-size">
    <b><a href="#webvtt-cue-size">#webvtt-cue-size</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-size-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-size-2">(2)</a> <a href="#ref-for-webvtt-cue-size-3">(3)</a> <a href="#ref-for-webvtt-cue-size-4">(4)</a> <a href="#ref-for-webvtt-cue-size-5">(5)</a> <a href="#ref-for-webvtt-cue-size-6">(6)</a>
-    <li><a href="#ref-for-webvtt-cue-size-7">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-cue-size-8">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-size-9">6.1. Processing model</a> <a href="#ref-for-webvtt-cue-size-10">(2)</a>
-    <li><a href="#ref-for-webvtt-cue-size-11">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-size-12">(2)</a> <a href="#ref-for-webvtt-cue-size-13">(3)</a> <a href="#ref-for-webvtt-cue-size-14">(4)</a>
+    <li><a href="#ref-for-webvtt-cue-size-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-size-2">(2)</a> <a href="#ref-for-webvtt-cue-size-3">(3)</a> <a href="#ref-for-webvtt-cue-size-4">(4)</a> <a href="#ref-for-webvtt-cue-size-5">(5)</a> <a href="#ref-for-webvtt-cue-size-6">(6)</a>
+    <li><a href="#ref-for-webvtt-cue-size-7">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-cue-size-8">6.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-webvtt-cue-size-9">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-size-10">7.2. Processing cue settings</a> <a href="#ref-for-webvtt-cue-size-11">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-size-12">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-size-13">(2)</a> <a href="#ref-for-webvtt-cue-size-14">(3)</a> <a href="#ref-for-webvtt-cue-size-15">(4)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-text-alignment">
    <b><a href="#webvtt-cue-text-alignment">#webvtt-cue-text-alignment</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-text-alignment-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-text-alignment-2">(2)</a> <a href="#ref-for-webvtt-cue-text-alignment-3">(3)</a> <a href="#ref-for-webvtt-cue-text-alignment-4">(4)</a> <a href="#ref-for-webvtt-cue-text-alignment-5">(5)</a> <a href="#ref-for-webvtt-cue-text-alignment-6">(6)</a> <a href="#ref-for-webvtt-cue-text-alignment-7">(7)</a> <a href="#ref-for-webvtt-cue-text-alignment-8">(8)</a> <a href="#ref-for-webvtt-cue-text-alignment-9">(9)</a> <a href="#ref-for-webvtt-cue-text-alignment-10">(10)</a> <a href="#ref-for-webvtt-cue-text-alignment-11">(11)</a> <a href="#ref-for-webvtt-cue-text-alignment-12">(12)</a>
-    <li><a href="#ref-for-webvtt-cue-text-alignment-13">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-cue-text-alignment-14">5.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-webvtt-cue-text-alignment-15">(2)</a> <a href="#ref-for-webvtt-cue-text-alignment-16">(3)</a> <a href="#ref-for-webvtt-cue-text-alignment-17">(4)</a> <a href="#ref-for-webvtt-cue-text-alignment-18">(5)</a>
-    <li><a href="#ref-for-webvtt-cue-text-alignment-19">6.1.1. Applying CSS properties to WebVTT Node Objects</a> <a href="#ref-for-webvtt-cue-text-alignment-20">(2)</a>
-    <li><a href="#ref-for-webvtt-cue-text-alignment-21">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-text-alignment-22">(2)</a> <a href="#ref-for-webvtt-cue-text-alignment-23">(3)</a> <a href="#ref-for-webvtt-cue-text-alignment-24">(4)</a> <a href="#ref-for-webvtt-cue-text-alignment-25">(5)</a>
+    <li><a href="#ref-for-webvtt-cue-text-alignment-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-text-alignment-2">(2)</a> <a href="#ref-for-webvtt-cue-text-alignment-3">(3)</a> <a href="#ref-for-webvtt-cue-text-alignment-4">(4)</a> <a href="#ref-for-webvtt-cue-text-alignment-5">(5)</a> <a href="#ref-for-webvtt-cue-text-alignment-6">(6)</a> <a href="#ref-for-webvtt-cue-text-alignment-7">(7)</a> <a href="#ref-for-webvtt-cue-text-alignment-8">(8)</a> <a href="#ref-for-webvtt-cue-text-alignment-9">(9)</a> <a href="#ref-for-webvtt-cue-text-alignment-10">(10)</a> <a href="#ref-for-webvtt-cue-text-alignment-11">(11)</a> <a href="#ref-for-webvtt-cue-text-alignment-12">(12)</a> <a href="#ref-for-webvtt-cue-text-alignment-13">(13)</a> <a href="#ref-for-webvtt-cue-text-alignment-14">(14)</a>
+    <li><a href="#ref-for-webvtt-cue-text-alignment-15">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-cue-text-alignment-16">6.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-webvtt-cue-text-alignment-17">(2)</a> <a href="#ref-for-webvtt-cue-text-alignment-18">(3)</a> <a href="#ref-for-webvtt-cue-text-alignment-19">(4)</a> <a href="#ref-for-webvtt-cue-text-alignment-20">(5)</a>
+    <li><a href="#ref-for-webvtt-cue-text-alignment-21">7.4. Applying CSS properties to WebVTT Node Objects</a> <a href="#ref-for-webvtt-cue-text-alignment-22">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-text-alignment-23">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-text-alignment-24">(2)</a> <a href="#ref-for-webvtt-cue-text-alignment-25">(3)</a> <a href="#ref-for-webvtt-cue-text-alignment-26">(4)</a> <a href="#ref-for-webvtt-cue-text-alignment-27">(5)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-start-alignment">
    <b><a href="#webvtt-cue-start-alignment">#webvtt-cue-start-alignment</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-start-alignment-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-start-alignment-2">(2)</a> <a href="#ref-for-webvtt-cue-start-alignment-3">(3)</a> <a href="#ref-for-webvtt-cue-start-alignment-4">(4)</a> <a href="#ref-for-webvtt-cue-start-alignment-5">(5)</a>
-    <li><a href="#ref-for-webvtt-cue-start-alignment-6">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-start-alignment-7">6.1.1. Applying CSS properties to WebVTT Node Objects</a>
-    <li><a href="#ref-for-webvtt-cue-start-alignment-8">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-start-alignment-9">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-start-alignment-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-start-alignment-2">(2)</a> <a href="#ref-for-webvtt-cue-start-alignment-3">(3)</a> <a href="#ref-for-webvtt-cue-start-alignment-4">(4)</a> <a href="#ref-for-webvtt-cue-start-alignment-5">(5)</a> <a href="#ref-for-webvtt-cue-start-alignment-6">(6)</a>
+    <li><a href="#ref-for-webvtt-cue-start-alignment-7">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-cue-start-alignment-8">7.4. Applying CSS properties to WebVTT Node Objects</a>
+    <li><a href="#ref-for-webvtt-cue-start-alignment-9">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-start-alignment-10">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-center-alignment">
    <b><a href="#webvtt-cue-center-alignment">#webvtt-cue-center-alignment</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-center-alignment-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-center-alignment-2">(2)</a> <a href="#ref-for-webvtt-cue-center-alignment-3">(3)</a> <a href="#ref-for-webvtt-cue-center-alignment-4">(4)</a>
-    <li><a href="#ref-for-webvtt-cue-center-alignment-5">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-cue-center-alignment-6">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-center-alignment-7">6.1.1. Applying CSS properties to WebVTT Node Objects</a>
-    <li><a href="#ref-for-webvtt-cue-center-alignment-8">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-center-alignment-9">(2)</a> <a href="#ref-for-webvtt-cue-center-alignment-10">(3)</a>
+    <li><a href="#ref-for-webvtt-cue-center-alignment-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-center-alignment-2">(2)</a> <a href="#ref-for-webvtt-cue-center-alignment-3">(3)</a> <a href="#ref-for-webvtt-cue-center-alignment-4">(4)</a>
+    <li><a href="#ref-for-webvtt-cue-center-alignment-5">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-cue-center-alignment-6">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-cue-center-alignment-7">7.4. Applying CSS properties to WebVTT Node Objects</a>
+    <li><a href="#ref-for-webvtt-cue-center-alignment-8">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-center-alignment-9">(2)</a> <a href="#ref-for-webvtt-cue-center-alignment-10">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-end-alignment">
    <b><a href="#webvtt-cue-end-alignment">#webvtt-cue-end-alignment</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-end-alignment-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-end-alignment-2">(2)</a> <a href="#ref-for-webvtt-cue-end-alignment-3">(3)</a> <a href="#ref-for-webvtt-cue-end-alignment-4">(4)</a>
-    <li><a href="#ref-for-webvtt-cue-end-alignment-5">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-end-alignment-6">6.1.1. Applying CSS properties to WebVTT Node Objects</a>
-    <li><a href="#ref-for-webvtt-cue-end-alignment-7">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-end-alignment-8">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-end-alignment-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-end-alignment-2">(2)</a> <a href="#ref-for-webvtt-cue-end-alignment-3">(3)</a> <a href="#ref-for-webvtt-cue-end-alignment-4">(4)</a> <a href="#ref-for-webvtt-cue-end-alignment-5">(5)</a>
+    <li><a href="#ref-for-webvtt-cue-end-alignment-6">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-cue-end-alignment-7">7.4. Applying CSS properties to WebVTT Node Objects</a>
+    <li><a href="#ref-for-webvtt-cue-end-alignment-8">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-end-alignment-9">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-left-alignment">
    <b><a href="#webvtt-cue-left-alignment">#webvtt-cue-left-alignment</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-left-alignment-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-left-alignment-2">(2)</a> <a href="#ref-for-webvtt-cue-left-alignment-3">(3)</a> <a href="#ref-for-webvtt-cue-left-alignment-4">(4)</a>
-    <li><a href="#ref-for-webvtt-cue-left-alignment-5">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-left-alignment-6">6.1.1. Applying CSS properties to WebVTT Node Objects</a>
-    <li><a href="#ref-for-webvtt-cue-left-alignment-7">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-left-alignment-8">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-left-alignment-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-left-alignment-2">(2)</a> <a href="#ref-for-webvtt-cue-left-alignment-3">(3)</a> <a href="#ref-for-webvtt-cue-left-alignment-4">(4)</a>
+    <li><a href="#ref-for-webvtt-cue-left-alignment-5">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-cue-left-alignment-6">7.4. Applying CSS properties to WebVTT Node Objects</a>
+    <li><a href="#ref-for-webvtt-cue-left-alignment-7">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-left-alignment-8">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-right-alignment">
    <b><a href="#webvtt-cue-right-alignment">#webvtt-cue-right-alignment</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-right-alignment-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-cue-right-alignment-2">(2)</a> <a href="#ref-for-webvtt-cue-right-alignment-3">(3)</a> <a href="#ref-for-webvtt-cue-right-alignment-4">(4)</a>
-    <li><a href="#ref-for-webvtt-cue-right-alignment-5">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-right-alignment-6">6.1.1. Applying CSS properties to WebVTT Node Objects</a>
-    <li><a href="#ref-for-webvtt-cue-right-alignment-7">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-right-alignment-8">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-right-alignment-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-cue-right-alignment-2">(2)</a> <a href="#ref-for-webvtt-cue-right-alignment-3">(3)</a> <a href="#ref-for-webvtt-cue-right-alignment-4">(4)</a>
+    <li><a href="#ref-for-webvtt-cue-right-alignment-5">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-cue-right-alignment-6">7.4. Applying CSS properties to WebVTT Node Objects</a>
+    <li><a href="#ref-for-webvtt-cue-right-alignment-7">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-right-alignment-8">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-region">
    <b><a href="#webvtt-cue-region">#webvtt-cue-region</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-region-1">3.1. WebVTT cues</a>
-    <li><a href="#ref-for-webvtt-cue-region-2">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-cue-region-3">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-cue-region-4">6.1. Processing model</a> <a href="#ref-for-webvtt-cue-region-5">(2)</a> <a href="#ref-for-webvtt-cue-region-6">(3)</a>
-    <li><a href="#ref-for-webvtt-cue-region-7">8.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-region-8">(2)</a> <a href="#ref-for-webvtt-cue-region-9">(3)</a>
+    <li><a href="#ref-for-webvtt-cue-region-1">3.3. WebVTT caption or subtitle cues</a>
+    <li><a href="#ref-for-webvtt-cue-region-2">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-cue-region-3">6.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-webvtt-cue-region-4">(2)</a> <a href="#ref-for-webvtt-cue-region-5">(3)</a> <a href="#ref-for-webvtt-cue-region-6">(4)</a>
+    <li><a href="#ref-for-webvtt-cue-region-7">7.1. Processing model</a> <a href="#ref-for-webvtt-cue-region-8">(2)</a> <a href="#ref-for-webvtt-cue-region-9">(3)</a>
+    <li><a href="#ref-for-webvtt-cue-region-10">9.1. The VTTCue interface</a> <a href="#ref-for-webvtt-cue-region-11">(2)</a> <a href="#ref-for-webvtt-cue-region-12">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-region">
    <b><a href="#webvtt-region">#webvtt-region</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-region-1">3.1. WebVTT cues</a> <a href="#ref-for-webvtt-region-2">(2)</a> <a href="#ref-for-webvtt-region-3">(3)</a>
-    <li><a href="#ref-for-webvtt-region-4">3.2. WebVTT regions</a> <a href="#ref-for-webvtt-region-5">(2)</a>
-    <li><a href="#ref-for-webvtt-region-6">4.3. WebVTT region settings</a> <a href="#ref-for-webvtt-region-7">(2)</a>
-    <li><a href="#ref-for-webvtt-region-8">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-region-9">5.2. WebVTT region settings parsing</a>
-    <li><a href="#ref-for-webvtt-region-10">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-region-11">6.1. Processing model</a> <a href="#ref-for-webvtt-region-12">(2)</a> <a href="#ref-for-webvtt-region-13">(3)</a>
-    <li><a href="#ref-for-webvtt-region-14">6.1.1. Applying CSS properties to WebVTT Node Objects</a>
-    <li><a href="#ref-for-webvtt-region-15">8.2. The VTTRegion interface</a> <a href="#ref-for-webvtt-region-16">(2)</a> <a href="#ref-for-webvtt-region-17">(3)</a> <a href="#ref-for-webvtt-region-18">(4)</a> <a href="#ref-for-webvtt-region-19">(5)</a> <a href="#ref-for-webvtt-region-20">(6)</a> <a href="#ref-for-webvtt-region-21">(7)</a> <a href="#ref-for-webvtt-region-22">(8)</a> <a href="#ref-for-webvtt-region-23">(9)</a> <a href="#ref-for-webvtt-region-24">(10)</a>
+    <li><a href="#ref-for-webvtt-region-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-webvtt-region-2">(2)</a> <a href="#ref-for-webvtt-region-3">(3)</a>
+    <li><a href="#ref-for-webvtt-region-4">3.4. WebVTT caption or subtitle regions</a> <a href="#ref-for-webvtt-region-5">(2)</a>
+    <li><a href="#ref-for-webvtt-region-6">4.3. WebVTT region settings</a> <a href="#ref-for-webvtt-region-7">(2)</a> <a href="#ref-for-webvtt-region-8">(3)</a>
+    <li><a href="#ref-for-webvtt-region-9">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-region-10">6.2. WebVTT region settings parsing</a>
+    <li><a href="#ref-for-webvtt-region-11">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-region-12">7.1. Processing model</a> <a href="#ref-for-webvtt-region-13">(2)</a> <a href="#ref-for-webvtt-region-14">(3)</a>
+    <li><a href="#ref-for-webvtt-region-15">7.4. Applying CSS properties to WebVTT Node Objects</a>
+    <li><a href="#ref-for-webvtt-region-16">9.2. The VTTRegion interface</a> <a href="#ref-for-webvtt-region-17">(2)</a> <a href="#ref-for-webvtt-region-18">(3)</a> <a href="#ref-for-webvtt-region-19">(4)</a> <a href="#ref-for-webvtt-region-20">(5)</a> <a href="#ref-for-webvtt-region-21">(6)</a> <a href="#ref-for-webvtt-region-22">(7)</a> <a href="#ref-for-webvtt-region-23">(8)</a> <a href="#ref-for-webvtt-region-24">(9)</a> <a href="#ref-for-webvtt-region-25">(10)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-region-identifier">
    <b><a href="#webvtt-region-identifier">#webvtt-region-identifier</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-webvtt-region-identifier-1">4.4. WebVTT cue settings</a>
-    <li><a href="#ref-for-webvtt-region-identifier-2">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-region-identifier-3">5.2. WebVTT region settings parsing</a>
-    <li><a href="#ref-for-webvtt-region-identifier-4">5.3. WebVTT cue timings and settings parsing</a>
-    <li><a href="#ref-for-webvtt-region-identifier-5">7.1. Introduction</a>
-    <li><a href="#ref-for-webvtt-region-identifier-6">7.2.3. The ::cue-region pseudo-element</a>
-    <li><a href="#ref-for-webvtt-region-identifier-7">8.2. The VTTRegion interface</a> <a href="#ref-for-webvtt-region-identifier-8">(2)</a> <a href="#ref-for-webvtt-region-identifier-9">(3)</a>
+    <li><a href="#ref-for-webvtt-region-identifier-2">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-region-identifier-3">6.2. WebVTT region settings parsing</a>
+    <li><a href="#ref-for-webvtt-region-identifier-4">6.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-webvtt-region-identifier-5">8.1. Introduction</a>
+    <li><a href="#ref-for-webvtt-region-identifier-6">8.2.3. The ::cue-region pseudo-element</a>
+    <li><a href="#ref-for-webvtt-region-identifier-7">9.2. The VTTRegion interface</a> <a href="#ref-for-webvtt-region-identifier-8">(2)</a> <a href="#ref-for-webvtt-region-identifier-9">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-region-width">
    <b><a href="#webvtt-region-width">#webvtt-region-width</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-region-width-1">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-region-width-2">5.2. WebVTT region settings parsing</a>
-    <li><a href="#ref-for-webvtt-region-width-3">6.1. Processing model</a> <a href="#ref-for-webvtt-region-width-4">(2)</a> <a href="#ref-for-webvtt-region-width-5">(3)</a> <a href="#ref-for-webvtt-region-width-6">(4)</a>
-    <li><a href="#ref-for-webvtt-region-width-7">8.2. The VTTRegion interface</a> <a href="#ref-for-webvtt-region-width-8">(2)</a> <a href="#ref-for-webvtt-region-width-9">(3)</a>
+    <li><a href="#ref-for-webvtt-region-width-1">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-region-width-2">6.2. WebVTT region settings parsing</a>
+    <li><a href="#ref-for-webvtt-region-width-3">7.1. Processing model</a> <a href="#ref-for-webvtt-region-width-4">(2)</a> <a href="#ref-for-webvtt-region-width-5">(3)</a> <a href="#ref-for-webvtt-region-width-6">(4)</a>
+    <li><a href="#ref-for-webvtt-region-width-7">9.2. The VTTRegion interface</a> <a href="#ref-for-webvtt-region-width-8">(2)</a> <a href="#ref-for-webvtt-region-width-9">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-region-lines">
    <b><a href="#webvtt-region-lines">#webvtt-region-lines</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-region-lines-1">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-region-lines-2">5.2. WebVTT region settings parsing</a>
-    <li><a href="#ref-for-webvtt-region-lines-3">6.1. Processing model</a>
-    <li><a href="#ref-for-webvtt-region-lines-4">8.2. The VTTRegion interface</a> <a href="#ref-for-webvtt-region-lines-5">(2)</a> <a href="#ref-for-webvtt-region-lines-6">(3)</a>
+    <li><a href="#ref-for-webvtt-region-lines-1">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-region-lines-2">6.2. WebVTT region settings parsing</a>
+    <li><a href="#ref-for-webvtt-region-lines-3">7.1. Processing model</a>
+    <li><a href="#ref-for-webvtt-region-lines-4">9.2. The VTTRegion interface</a> <a href="#ref-for-webvtt-region-lines-5">(2)</a> <a href="#ref-for-webvtt-region-lines-6">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-region-anchor">
    <b><a href="#webvtt-region-anchor">#webvtt-region-anchor</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-region-anchor-1">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-region-anchor-2">5.2. WebVTT region settings parsing</a>
-    <li><a href="#ref-for-webvtt-region-anchor-3">6.1. Processing model</a> <a href="#ref-for-webvtt-region-anchor-4">(2)</a> <a href="#ref-for-webvtt-region-anchor-5">(3)</a> <a href="#ref-for-webvtt-region-anchor-6">(4)</a>
-    <li><a href="#ref-for-webvtt-region-anchor-7">8.2. The VTTRegion interface</a> <a href="#ref-for-webvtt-region-anchor-8">(2)</a> <a href="#ref-for-webvtt-region-anchor-9">(3)</a> <a href="#ref-for-webvtt-region-anchor-10">(4)</a> <a href="#ref-for-webvtt-region-anchor-11">(5)</a> <a href="#ref-for-webvtt-region-anchor-12">(6)</a>
+    <li><a href="#ref-for-webvtt-region-anchor-1">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-region-anchor-2">6.2. WebVTT region settings parsing</a>
+    <li><a href="#ref-for-webvtt-region-anchor-3">7.1. Processing model</a> <a href="#ref-for-webvtt-region-anchor-4">(2)</a> <a href="#ref-for-webvtt-region-anchor-5">(3)</a> <a href="#ref-for-webvtt-region-anchor-6">(4)</a>
+    <li><a href="#ref-for-webvtt-region-anchor-7">9.2. The VTTRegion interface</a> <a href="#ref-for-webvtt-region-anchor-8">(2)</a> <a href="#ref-for-webvtt-region-anchor-9">(3)</a> <a href="#ref-for-webvtt-region-anchor-10">(4)</a> <a href="#ref-for-webvtt-region-anchor-11">(5)</a> <a href="#ref-for-webvtt-region-anchor-12">(6)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-region-viewport-anchor">
    <b><a href="#webvtt-region-viewport-anchor">#webvtt-region-viewport-anchor</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-region-viewport-anchor-1">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-region-viewport-anchor-2">5.2. WebVTT region settings parsing</a>
-    <li><a href="#ref-for-webvtt-region-viewport-anchor-3">8.2. The VTTRegion interface</a> <a href="#ref-for-webvtt-region-viewport-anchor-4">(2)</a> <a href="#ref-for-webvtt-region-viewport-anchor-5">(3)</a> <a href="#ref-for-webvtt-region-viewport-anchor-6">(4)</a> <a href="#ref-for-webvtt-region-viewport-anchor-7">(5)</a> <a href="#ref-for-webvtt-region-viewport-anchor-8">(6)</a>
+    <li><a href="#ref-for-webvtt-region-viewport-anchor-1">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-region-viewport-anchor-2">6.2. WebVTT region settings parsing</a>
+    <li><a href="#ref-for-webvtt-region-viewport-anchor-3">9.2. The VTTRegion interface</a> <a href="#ref-for-webvtt-region-viewport-anchor-4">(2)</a> <a href="#ref-for-webvtt-region-viewport-anchor-5">(3)</a> <a href="#ref-for-webvtt-region-viewport-anchor-6">(4)</a> <a href="#ref-for-webvtt-region-viewport-anchor-7">(5)</a> <a href="#ref-for-webvtt-region-viewport-anchor-8">(6)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-region-scroll">
    <b><a href="#webvtt-region-scroll">#webvtt-region-scroll</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-region-scroll-1">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-region-scroll-2">5.2. WebVTT region settings parsing</a>
-    <li><a href="#ref-for-webvtt-region-scroll-3">6.1. Processing model</a>
-    <li><a href="#ref-for-webvtt-region-scroll-4">8.2. The VTTRegion interface</a> <a href="#ref-for-webvtt-region-scroll-5">(2)</a> <a href="#ref-for-webvtt-region-scroll-6">(3)</a> <a href="#ref-for-webvtt-region-scroll-7">(4)</a> <a href="#ref-for-webvtt-region-scroll-8">(5)</a>
+    <li><a href="#ref-for-webvtt-region-scroll-1">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-region-scroll-2">6.2. WebVTT region settings parsing</a>
+    <li><a href="#ref-for-webvtt-region-scroll-3">7.1. Processing model</a>
+    <li><a href="#ref-for-webvtt-region-scroll-4">9.2. The VTTRegion interface</a> <a href="#ref-for-webvtt-region-scroll-5">(2)</a> <a href="#ref-for-webvtt-region-scroll-6">(3)</a> <a href="#ref-for-webvtt-region-scroll-7">(4)</a> <a href="#ref-for-webvtt-region-scroll-8">(5)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-region-scroll-none">
    <b><a href="#webvtt-region-scroll-none">#webvtt-region-scroll-none</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-region-scroll-none-1">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-webvtt-region-scroll-none-2">8.2. The VTTRegion interface</a>
+    <li><a href="#ref-for-webvtt-region-scroll-none-1">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-region-scroll-none-2">9.2. The VTTRegion interface</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-region-scroll-up">
    <b><a href="#webvtt-region-scroll-up">#webvtt-region-scroll-up</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-region-scroll-up-1">5.2. WebVTT region settings parsing</a>
-    <li><a href="#ref-for-webvtt-region-scroll-up-2">6.1. Processing model</a>
-    <li><a href="#ref-for-webvtt-region-scroll-up-3">8.2. The VTTRegion interface</a>
+    <li><a href="#ref-for-webvtt-region-scroll-up-1">6.2. WebVTT region settings parsing</a>
+    <li><a href="#ref-for-webvtt-region-scroll-up-2">7.1. Processing model</a>
+    <li><a href="#ref-for-webvtt-region-scroll-up-3">9.2. The VTTRegion interface</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="text-track-list-of-regions">
    <b><a href="#text-track-list-of-regions">#text-track-list-of-regions</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-text-track-list-of-regions-1">5.1. WebVTT file parsing</a>
-    <li><a href="#ref-for-text-track-list-of-regions-2">5.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-text-track-list-of-regions-3">(2)</a>
-    <li><a href="#ref-for-text-track-list-of-regions-4">6.1. Processing model</a>
+    <li><a href="#ref-for-text-track-list-of-regions-1">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-text-track-list-of-regions-2">6.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-text-track-list-of-regions-3">(2)</a>
+    <li><a href="#ref-for-text-track-list-of-regions-4">7.1. Processing model</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-file">
@@ -6726,8 +7079,8 @@
     <li><a href="#ref-for-webvtt-file-10">4.5.1. WebVTT file using only nested cues</a>
     <li><a href="#ref-for-webvtt-file-11">4.6. Types of WebVTT files</a>
     <li><a href="#ref-for-webvtt-file-12">4.6.1. WebVTT file using metadata content</a>
-    <li><a href="#ref-for-webvtt-file-13">4.6.3. WebVTT file using cue text</a>
-    <li><a href="#ref-for-webvtt-file-14">5.1. WebVTT file parsing</a> <a href="#ref-for-webvtt-file-15">(2)</a> <a href="#ref-for-webvtt-file-16">(3)</a>
+    <li><a href="#ref-for-webvtt-file-13">4.6.3. WebVTT file using caption or subtitle cue text</a>
+    <li><a href="#ref-for-webvtt-file-14">6.1. WebVTT file parsing</a> <a href="#ref-for-webvtt-file-15">(2)</a> <a href="#ref-for-webvtt-file-16">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-file-body">
@@ -6741,9 +7094,9 @@
    <ul>
     <li><a href="#ref-for-webvtt-line-terminator-1">4.1. WebVTT file structure</a> <a href="#ref-for-webvtt-line-terminator-2">(2)</a> <a href="#ref-for-webvtt-line-terminator-3">(3)</a> <a href="#ref-for-webvtt-line-terminator-4">(4)</a> <a href="#ref-for-webvtt-line-terminator-5">(5)</a> <a href="#ref-for-webvtt-line-terminator-6">(6)</a> <a href="#ref-for-webvtt-line-terminator-7">(7)</a> <a href="#ref-for-webvtt-line-terminator-8">(8)</a> <a href="#ref-for-webvtt-line-terminator-9">(9)</a> <a href="#ref-for-webvtt-line-terminator-10">(10)</a> <a href="#ref-for-webvtt-line-terminator-11">(11)</a> <a href="#ref-for-webvtt-line-terminator-12">(12)</a> <a href="#ref-for-webvtt-line-terminator-13">(13)</a> <a href="#ref-for-webvtt-line-terminator-14">(14)</a> <a href="#ref-for-webvtt-line-terminator-15">(15)</a> <a href="#ref-for-webvtt-line-terminator-16">(16)</a>
     <li><a href="#ref-for-webvtt-line-terminator-17">4.2.1. WebVTT metadata text</a> <a href="#ref-for-webvtt-line-terminator-18">(2)</a> <a href="#ref-for-webvtt-line-terminator-19">(3)</a>
-    <li><a href="#ref-for-webvtt-line-terminator-20">4.2.2. WebVTT cue text</a> <a href="#ref-for-webvtt-line-terminator-21">(2)</a> <a href="#ref-for-webvtt-line-terminator-22">(3)</a> <a href="#ref-for-webvtt-line-terminator-23">(4)</a> <a href="#ref-for-webvtt-line-terminator-24">(5)</a>
-    <li><a href="#ref-for-webvtt-line-terminator-25">4.3. WebVTT region settings</a> <a href="#ref-for-webvtt-line-terminator-26">(2)</a>
-    <li><a href="#ref-for-webvtt-line-terminator-27">4.6.2. WebVTT file using chapter title text</a>
+    <li><a href="#ref-for-webvtt-line-terminator-20">4.2.2. WebVTT caption or subtitle cue text</a> <a href="#ref-for-webvtt-line-terminator-21">(2)</a> <a href="#ref-for-webvtt-line-terminator-22">(3)</a> <a href="#ref-for-webvtt-line-terminator-23">(4)</a> <a href="#ref-for-webvtt-line-terminator-24">(5)</a>
+    <li><a href="#ref-for-webvtt-line-terminator-25">4.2.3. WebVTT chapter title text</a>
+    <li><a href="#ref-for-webvtt-line-terminator-26">4.3. WebVTT region settings</a> <a href="#ref-for-webvtt-line-terminator-27">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-region-definition-block">
@@ -6769,10 +7122,10 @@
    <b><a href="#cue-payload">#cue-payload</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-cue-payload-1">4.1. WebVTT file structure</a>
-    <li><a href="#ref-for-cue-payload-2">4.2.2. WebVTT cue text</a>
+    <li><a href="#ref-for-cue-payload-2">4.2.2. WebVTT caption or subtitle cue text</a>
     <li><a href="#ref-for-cue-payload-3">4.6.1. WebVTT file using metadata content</a>
     <li><a href="#ref-for-cue-payload-4">4.6.2. WebVTT file using chapter title text</a>
-    <li><a href="#ref-for-cue-payload-5">4.6.3. WebVTT file using cue text</a>
+    <li><a href="#ref-for-cue-payload-5">4.6.3. WebVTT file using caption or subtitle cue text</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-identifier">
@@ -6791,22 +7144,22 @@
    <b><a href="#webvtt-timestamp">#webvtt-timestamp</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-webvtt-timestamp-1">4.1. WebVTT file structure</a> <a href="#ref-for-webvtt-timestamp-2">(2)</a> <a href="#ref-for-webvtt-timestamp-3">(3)</a> <a href="#ref-for-webvtt-timestamp-4">(4)</a> <a href="#ref-for-webvtt-timestamp-5">(5)</a>
-    <li><a href="#ref-for-webvtt-timestamp-6">4.2.2. WebVTT cue text</a> <a href="#ref-for-webvtt-timestamp-7">(2)</a>
-    <li><a href="#ref-for-webvtt-timestamp-8">5.5. WebVTT cue text DOM construction rules</a>
+    <li><a href="#ref-for-webvtt-timestamp-6">4.2.2. WebVTT caption or subtitle cue text</a> <a href="#ref-for-webvtt-timestamp-7">(2)</a>
+    <li><a href="#ref-for-webvtt-timestamp-8">6.5. WebVTT cue text DOM construction rules</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-settings-list">
    <b><a href="#webvtt-cue-settings-list">#webvtt-cue-settings-list</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-webvtt-cue-settings-list-1">4.1. WebVTT file structure</a>
-    <li><a href="#ref-for-webvtt-cue-settings-list-2">4.3. WebVTT region settings</a>
-    <li><a href="#ref-for-webvtt-cue-settings-list-3">4.4. WebVTT cue settings</a> <a href="#ref-for-webvtt-cue-settings-list-4">(2)</a> <a href="#ref-for-webvtt-cue-settings-list-5">(3)</a>
+    <li><a href="#ref-for-webvtt-cue-settings-list-2">4.3. WebVTT region settings</a> <a href="#ref-for-webvtt-cue-settings-list-3">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-settings-list-4">4.4. WebVTT cue settings</a> <a href="#ref-for-webvtt-cue-settings-list-5">(2)</a> <a href="#ref-for-webvtt-cue-settings-list-6">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-setting">
    <b><a href="#webvtt-cue-setting">#webvtt-cue-setting</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-setting-1">4.4. WebVTT cue settings</a>
+    <li><a href="#ref-for-webvtt-cue-setting-1">4.4. WebVTT cue settings</a> <a href="#ref-for-webvtt-cue-setting-2">(2)</a> <a href="#ref-for-webvtt-cue-setting-3">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-setting-name">
@@ -6829,7 +7182,7 @@
     <li><a href="#ref-for-webvtt-percentage-1">4.1. WebVTT file structure</a>
     <li><a href="#ref-for-webvtt-percentage-2">4.3. WebVTT region settings</a> <a href="#ref-for-webvtt-percentage-3">(2)</a> <a href="#ref-for-webvtt-percentage-4">(3)</a> <a href="#ref-for-webvtt-percentage-5">(4)</a> <a href="#ref-for-webvtt-percentage-6">(5)</a>
     <li><a href="#ref-for-webvtt-percentage-7">4.4. WebVTT cue settings</a> <a href="#ref-for-webvtt-percentage-8">(2)</a> <a href="#ref-for-webvtt-percentage-9">(3)</a>
-    <li><a href="#ref-for-webvtt-percentage-10">5.2. WebVTT region settings parsing</a>
+    <li><a href="#ref-for-webvtt-percentage-10">6.2. WebVTT region settings parsing</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-comment-block">
@@ -6846,113 +7199,131 @@
     <li><a href="#ref-for-webvtt-metadata-text-3">4.6.1. WebVTT file using metadata content</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="webvtt-cue-text">
-   <b><a href="#webvtt-cue-text">#webvtt-cue-text</a></b><b>Referenced in:</b>
+  <aside class="dfn-panel" data-for="webvtt-caption-or-subtitle-cue-text">
+   <b><a href="#webvtt-caption-or-subtitle-cue-text">#webvtt-caption-or-subtitle-cue-text</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-text-1">3.1. WebVTT cues</a>
-    <li><a href="#ref-for-webvtt-cue-text-2">4.1. WebVTT file structure</a>
-    <li><a href="#ref-for-webvtt-cue-text-3">4.2.2. WebVTT cue text</a>
-    <li><a href="#ref-for-webvtt-cue-text-4">4.6.2. WebVTT file using chapter title text</a>
-    <li><a href="#ref-for-webvtt-cue-text-5">4.6.3. WebVTT file using cue text</a>
+    <li><a href="#ref-for-webvtt-caption-or-subtitle-cue-text-1">2.1. Conformance classes</a>
+    <li><a href="#ref-for-webvtt-caption-or-subtitle-cue-text-2">4.1. WebVTT file structure</a>
+    <li><a href="#ref-for-webvtt-caption-or-subtitle-cue-text-3">4.2.2. WebVTT caption or subtitle cue text</a>
+    <li><a href="#ref-for-webvtt-caption-or-subtitle-cue-text-4">4.6.3. WebVTT file using caption or subtitle cue text</a>
+    <li><a href="#ref-for-webvtt-caption-or-subtitle-cue-text-5">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-caption-or-subtitle-cue-text-6">(2)</a> <a href="#ref-for-webvtt-caption-or-subtitle-cue-text-7">(3)</a> <a href="#ref-for-webvtt-caption-or-subtitle-cue-text-8">(4)</a> <a href="#ref-for-webvtt-caption-or-subtitle-cue-text-9">(5)</a> <a href="#ref-for-webvtt-caption-or-subtitle-cue-text-10">(6)</a> <a href="#ref-for-webvtt-caption-or-subtitle-cue-text-11">(7)</a> <a href="#ref-for-webvtt-caption-or-subtitle-cue-text-12">(8)</a>
-    <li><a href="#ref-for-webvtt-cue-text-6">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-cue-text-7">(2)</a> <a href="#ref-for-webvtt-cue-text-8">(3)</a> <a href="#ref-for-webvtt-cue-text-9">(4)</a> <a href="#ref-for-webvtt-cue-text-10">(5)</a> <a href="#ref-for-webvtt-cue-text-11">(6)</a> <a href="#ref-for-webvtt-cue-text-12">(7)</a> <a href="#ref-for-webvtt-cue-text-13">(8)</a> <a href="#ref-for-webvtt-cue-text-14">(9)</a> <a href="#ref-for-webvtt-cue-text-15">(10)</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="webvtt-cue-components">
-   <b><a href="#webvtt-cue-components">#webvtt-cue-components</a></b><b>Referenced in:</b>
+  <aside class="dfn-panel" data-for="webvtt-caption-or-subtitle-cue-components">
+   <b><a href="#webvtt-caption-or-subtitle-cue-components">#webvtt-caption-or-subtitle-cue-components</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-components-1">4.2.2. WebVTT cue text</a> <a href="#ref-for-webvtt-cue-components-2">(2)</a> <a href="#ref-for-webvtt-cue-components-3">(3)</a>
+    <li><a href="#ref-for-webvtt-caption-or-subtitle-cue-components-1">4.2.2. WebVTT caption or subtitle cue text</a> <a href="#ref-for-webvtt-caption-or-subtitle-cue-components-2">(2)</a> <a href="#ref-for-webvtt-caption-or-subtitle-cue-components-3">(3)</a> <a href="#ref-for-webvtt-caption-or-subtitle-cue-components-4">(4)</a>
+    <li><a href="#ref-for-webvtt-caption-or-subtitle-cue-components-5">5. Default classes for WebVTT Caption or Subtitle Cue Components</a>
+    <li><a href="#ref-for-webvtt-caption-or-subtitle-cue-components-6">5.1. Default text colors</a>
+    <li><a href="#ref-for-webvtt-caption-or-subtitle-cue-components-7">5.2. Default text background colors</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="cue-component-class-names">
+   <b><a href="#cue-component-class-names">#cue-component-class-names</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-cue-component-class-names-1">5. Default classes for WebVTT Caption or Subtitle Cue Components</a>
+    <li><a href="#ref-for-cue-component-class-names-2">5.1. Default text colors</a> <a href="#ref-for-cue-component-class-names-3">(2)</a>
+    <li><a href="#ref-for-cue-component-class-names-4">5.2. Default text background colors</a> <a href="#ref-for-cue-component-class-names-5">(2)</a>
+    <li><a href="#ref-for-cue-component-class-names-6">6.4. WebVTT cue text parsing rules</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-internal-text">
    <b><a href="#webvtt-cue-internal-text">#webvtt-cue-internal-text</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-internal-text-1">4.2.2. WebVTT cue text</a> <a href="#ref-for-webvtt-cue-internal-text-2">(2)</a> <a href="#ref-for-webvtt-cue-internal-text-3">(3)</a> <a href="#ref-for-webvtt-cue-internal-text-4">(4)</a> <a href="#ref-for-webvtt-cue-internal-text-5">(5)</a> <a href="#ref-for-webvtt-cue-internal-text-6">(6)</a> <a href="#ref-for-webvtt-cue-internal-text-7">(7)</a> <a href="#ref-for-webvtt-cue-internal-text-8">(8)</a>
+    <li><a href="#ref-for-webvtt-cue-internal-text-1">4.2.2. WebVTT caption or subtitle cue text</a> <a href="#ref-for-webvtt-cue-internal-text-2">(2)</a> <a href="#ref-for-webvtt-cue-internal-text-3">(3)</a> <a href="#ref-for-webvtt-cue-internal-text-4">(4)</a> <a href="#ref-for-webvtt-cue-internal-text-5">(5)</a> <a href="#ref-for-webvtt-cue-internal-text-6">(6)</a> <a href="#ref-for-webvtt-cue-internal-text-7">(7)</a> <a href="#ref-for-webvtt-cue-internal-text-8">(8)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-class-span">
    <b><a href="#webvtt-cue-class-span">#webvtt-cue-class-span</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-class-span-1">4.2.2. WebVTT cue text</a>
-    <li><a href="#ref-for-webvtt-cue-class-span-2">5.4. WebVTT cue text parsing rules</a>
+    <li><a href="#ref-for-webvtt-cue-class-span-1">4.2.2. WebVTT caption or subtitle cue text</a>
+    <li><a href="#ref-for-webvtt-cue-class-span-2">6.4. WebVTT cue text parsing rules</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-italics-span">
    <b><a href="#webvtt-cue-italics-span">#webvtt-cue-italics-span</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-italics-span-1">4.2.2. WebVTT cue text</a>
-    <li><a href="#ref-for-webvtt-cue-italics-span-2">5.4. WebVTT cue text parsing rules</a>
+    <li><a href="#ref-for-webvtt-cue-italics-span-1">4.2.2. WebVTT caption or subtitle cue text</a>
+    <li><a href="#ref-for-webvtt-cue-italics-span-2">6.4. WebVTT cue text parsing rules</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-bold-span">
    <b><a href="#webvtt-cue-bold-span">#webvtt-cue-bold-span</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-bold-span-1">4.2.2. WebVTT cue text</a>
-    <li><a href="#ref-for-webvtt-cue-bold-span-2">5.4. WebVTT cue text parsing rules</a>
+    <li><a href="#ref-for-webvtt-cue-bold-span-1">4.2.2. WebVTT caption or subtitle cue text</a>
+    <li><a href="#ref-for-webvtt-cue-bold-span-2">6.4. WebVTT cue text parsing rules</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-underline-span">
    <b><a href="#webvtt-cue-underline-span">#webvtt-cue-underline-span</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-underline-span-1">4.2.2. WebVTT cue text</a>
-    <li><a href="#ref-for-webvtt-cue-underline-span-2">5.4. WebVTT cue text parsing rules</a>
+    <li><a href="#ref-for-webvtt-cue-underline-span-1">4.2.2. WebVTT caption or subtitle cue text</a>
+    <li><a href="#ref-for-webvtt-cue-underline-span-2">6.4. WebVTT cue text parsing rules</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-ruby-span">
    <b><a href="#webvtt-cue-ruby-span">#webvtt-cue-ruby-span</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-ruby-span-1">4.2.2. WebVTT cue text</a> <a href="#ref-for-webvtt-cue-ruby-span-2">(2)</a>
-    <li><a href="#ref-for-webvtt-cue-ruby-span-3">5.4. WebVTT cue text parsing rules</a>
+    <li><a href="#ref-for-webvtt-cue-ruby-span-1">4.2.2. WebVTT caption or subtitle cue text</a> <a href="#ref-for-webvtt-cue-ruby-span-2">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-ruby-span-3">6.4. WebVTT cue text parsing rules</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-ruby-text-span">
    <b><a href="#webvtt-cue-ruby-text-span">#webvtt-cue-ruby-text-span</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-ruby-text-span-1">5.4. WebVTT cue text parsing rules</a>
+    <li><a href="#ref-for-webvtt-cue-ruby-text-span-1">6.4. WebVTT cue text parsing rules</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-voice-span">
    <b><a href="#webvtt-cue-voice-span">#webvtt-cue-voice-span</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-voice-span-1">4.2.2. WebVTT cue text</a> <a href="#ref-for-webvtt-cue-voice-span-2">(2)</a>
-    <li><a href="#ref-for-webvtt-cue-voice-span-3">5.4. WebVTT cue text parsing rules</a>
+    <li><a href="#ref-for-webvtt-cue-voice-span-1">4.2.2. WebVTT caption or subtitle cue text</a> <a href="#ref-for-webvtt-cue-voice-span-2">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-voice-span-3">6.4. WebVTT cue text parsing rules</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-language-span">
    <b><a href="#webvtt-cue-language-span">#webvtt-cue-language-span</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-language-span-1">4.2.2. WebVTT cue text</a>
-    <li><a href="#ref-for-webvtt-cue-language-span-2">5.4. WebVTT cue text parsing rules</a>
+    <li><a href="#ref-for-webvtt-cue-language-span-1">4.2.2. WebVTT caption or subtitle cue text</a>
+    <li><a href="#ref-for-webvtt-cue-language-span-2">6.4. WebVTT cue text parsing rules</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-span-start-tag">
    <b><a href="#webvtt-cue-span-start-tag">#webvtt-cue-span-start-tag</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-span-start-tag-1">4.2.2. WebVTT cue text</a> <a href="#ref-for-webvtt-cue-span-start-tag-2">(2)</a> <a href="#ref-for-webvtt-cue-span-start-tag-3">(3)</a> <a href="#ref-for-webvtt-cue-span-start-tag-4">(4)</a> <a href="#ref-for-webvtt-cue-span-start-tag-5">(5)</a> <a href="#ref-for-webvtt-cue-span-start-tag-6">(6)</a> <a href="#ref-for-webvtt-cue-span-start-tag-7">(7)</a> <a href="#ref-for-webvtt-cue-span-start-tag-8">(8)</a>
+    <li><a href="#ref-for-webvtt-cue-span-start-tag-1">4.2.2. WebVTT caption or subtitle cue text</a> <a href="#ref-for-webvtt-cue-span-start-tag-2">(2)</a> <a href="#ref-for-webvtt-cue-span-start-tag-3">(3)</a> <a href="#ref-for-webvtt-cue-span-start-tag-4">(4)</a> <a href="#ref-for-webvtt-cue-span-start-tag-5">(5)</a> <a href="#ref-for-webvtt-cue-span-start-tag-6">(6)</a> <a href="#ref-for-webvtt-cue-span-start-tag-7">(7)</a> <a href="#ref-for-webvtt-cue-span-start-tag-8">(8)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-span-end-tag">
    <b><a href="#webvtt-cue-span-end-tag">#webvtt-cue-span-end-tag</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-span-end-tag-1">4.2.2. WebVTT cue text</a> <a href="#ref-for-webvtt-cue-span-end-tag-2">(2)</a> <a href="#ref-for-webvtt-cue-span-end-tag-3">(3)</a> <a href="#ref-for-webvtt-cue-span-end-tag-4">(4)</a> <a href="#ref-for-webvtt-cue-span-end-tag-5">(5)</a> <a href="#ref-for-webvtt-cue-span-end-tag-6">(6)</a> <a href="#ref-for-webvtt-cue-span-end-tag-7">(7)</a> <a href="#ref-for-webvtt-cue-span-end-tag-8">(8)</a>
+    <li><a href="#ref-for-webvtt-cue-span-end-tag-1">4.2.2. WebVTT caption or subtitle cue text</a> <a href="#ref-for-webvtt-cue-span-end-tag-2">(2)</a> <a href="#ref-for-webvtt-cue-span-end-tag-3">(3)</a> <a href="#ref-for-webvtt-cue-span-end-tag-4">(4)</a> <a href="#ref-for-webvtt-cue-span-end-tag-5">(5)</a> <a href="#ref-for-webvtt-cue-span-end-tag-6">(6)</a> <a href="#ref-for-webvtt-cue-span-end-tag-7">(7)</a> <a href="#ref-for-webvtt-cue-span-end-tag-8">(8)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-timestamp">
    <b><a href="#webvtt-cue-timestamp">#webvtt-cue-timestamp</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-timestamp-1">4.2.2. WebVTT cue text</a> <a href="#ref-for-webvtt-cue-timestamp-2">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-timestamp-1">4.2.2. WebVTT caption or subtitle cue text</a> <a href="#ref-for-webvtt-cue-timestamp-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-text-span">
    <b><a href="#webvtt-cue-text-span">#webvtt-cue-text-span</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-text-span-1">4.2.2. WebVTT cue text</a>
-    <li><a href="#ref-for-webvtt-cue-text-span-2">4.6.2. WebVTT file using chapter title text</a>
+    <li><a href="#ref-for-webvtt-cue-text-span-1">4.2.2. WebVTT caption or subtitle cue text</a>
+    <li><a href="#ref-for-webvtt-cue-text-span-2">4.2.3. WebVTT chapter title text</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-span-start-tag-annotation-text">
    <b><a href="#webvtt-cue-span-start-tag-annotation-text">#webvtt-cue-span-start-tag-annotation-text</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-span-start-tag-annotation-text-1">4.2.2. WebVTT cue text</a>
+    <li><a href="#ref-for-webvtt-cue-span-start-tag-annotation-text-1">4.2.2. WebVTT caption or subtitle cue text</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="webvtt-chapter-title-text">
+   <b><a href="#webvtt-chapter-title-text">#webvtt-chapter-title-text</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-webvtt-chapter-title-text-1">4.1. WebVTT file structure</a>
+    <li><a href="#ref-for-webvtt-chapter-title-text-2">4.6.2. WebVTT file using chapter title text</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-region-settings-list">
@@ -6965,7 +7336,7 @@
   <aside class="dfn-panel" data-for="webvtt-region-identifier-setting">
    <b><a href="#webvtt-region-identifier-setting">#webvtt-region-identifier-setting</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-region-identifier-setting-1">4.3. WebVTT region settings</a> <a href="#ref-for-webvtt-region-identifier-setting-2">(2)</a> <a href="#ref-for-webvtt-region-identifier-setting-3">(3)</a> <a href="#ref-for-webvtt-region-identifier-setting-4">(4)</a>
+    <li><a href="#ref-for-webvtt-region-identifier-setting-1">4.3. WebVTT region settings</a> <a href="#ref-for-webvtt-region-identifier-setting-2">(2)</a> <a href="#ref-for-webvtt-region-identifier-setting-3">(3)</a> <a href="#ref-for-webvtt-region-identifier-setting-4">(4)</a> <a href="#ref-for-webvtt-region-identifier-setting-5">(5)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-region-width-setting">
@@ -7041,540 +7412,541 @@
     <li><a href="#ref-for-webvtt-file-using-only-nested-cues-3">4.6.2. WebVTT file using chapter title text</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="webvtt-chapter-title-text">
-   <b><a href="#webvtt-chapter-title-text">#webvtt-chapter-title-text</a></b><b>Referenced in:</b>
-   <ul>
-    <li><a href="#ref-for-webvtt-chapter-title-text-1">4.1. WebVTT file structure</a>
-    <li><a href="#ref-for-webvtt-chapter-title-text-2">4.6.2. WebVTT file using chapter title text</a>
-   </ul>
-  </aside>
   <aside class="dfn-panel" data-for="webvtt-parser">
    <b><a href="#webvtt-parser">#webvtt-parser</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-parser-1">3.1. WebVTT cues</a>
-    <li><a href="#ref-for-webvtt-parser-2">5.1. WebVTT file parsing</a> <a href="#ref-for-webvtt-parser-3">(2)</a> <a href="#ref-for-webvtt-parser-4">(3)</a>
+    <li><a href="#ref-for-webvtt-parser-1">3.3. WebVTT caption or subtitle cues</a>
+    <li><a href="#ref-for-webvtt-parser-2">6.1. WebVTT file parsing</a> <a href="#ref-for-webvtt-parser-3">(2)</a> <a href="#ref-for-webvtt-parser-4">(3)</a>
-    <li><a href="#ref-for-webvtt-parser-5">5.2. WebVTT region settings parsing</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="incremental-webvtt-parser">
    <b><a href="#incremental-webvtt-parser">#incremental-webvtt-parser</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-incremental-webvtt-parser-1">5.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-incremental-webvtt-parser-1">6.1. WebVTT file parsing</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-parser-algorithm">
    <b><a href="#webvtt-parser-algorithm">#webvtt-parser-algorithm</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-parser-algorithm-1">5.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-parser-algorithm-1">6.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-webvtt-parser-algorithm-2">6.2. WebVTT region settings parsing</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="collect-a-webvtt-block">
    <b><a href="#collect-a-webvtt-block">#collect-a-webvtt-block</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-collect-a-webvtt-block-1">5.1. WebVTT file parsing</a> <a href="#ref-for-collect-a-webvtt-block-2">(2)</a>
+    <li><a href="#ref-for-collect-a-webvtt-block-1">6.1. WebVTT file parsing</a> <a href="#ref-for-collect-a-webvtt-block-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="collect-webvtt-region-settings">
    <b><a href="#collect-webvtt-region-settings">#collect-webvtt-region-settings</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-collect-webvtt-region-settings-1">5.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-collect-webvtt-region-settings-1">6.1. WebVTT file parsing</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-region-object">
    <b><a href="#webvtt-region-object">#webvtt-region-object</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-region-object-1">5.1. WebVTT file parsing</a> <a href="#ref-for-webvtt-region-object-2">(2)</a>
-    <li><a href="#ref-for-webvtt-region-object-3">5.2. WebVTT region settings parsing</a>
-    <li><a href="#ref-for-webvtt-region-object-4">5.5. WebVTT cue text DOM construction rules</a>
-    <li><a href="#ref-for-webvtt-region-object-5">6.1. Processing model</a>
-    <li><a href="#ref-for-webvtt-region-object-6">6.1.1. Applying CSS properties to WebVTT Node Objects</a> <a href="#ref-for-webvtt-region-object-7">(2)</a> <a href="#ref-for-webvtt-region-object-8">(3)</a> <a href="#ref-for-webvtt-region-object-9">(4)</a>
-    <li><a href="#ref-for-webvtt-region-object-10">7.1. Introduction</a> <a href="#ref-for-webvtt-region-object-11">(2)</a>
-    <li><a href="#ref-for-webvtt-region-object-12">7.2.3. The ::cue-region pseudo-element</a> <a href="#ref-for-webvtt-region-object-13">(2)</a> <a href="#ref-for-webvtt-region-object-14">(3)</a> <a href="#ref-for-webvtt-region-object-15">(4)</a>
+    <li><a href="#ref-for-webvtt-region-object-1">6.1. WebVTT file parsing</a> <a href="#ref-for-webvtt-region-object-2">(2)</a>
+    <li><a href="#ref-for-webvtt-region-object-3">6.2. WebVTT region settings parsing</a>
+    <li><a href="#ref-for-webvtt-region-object-4">6.5. WebVTT cue text DOM construction rules</a>
+    <li><a href="#ref-for-webvtt-region-object-5">7.1. Processing model</a>
+    <li><a href="#ref-for-webvtt-region-object-6">7.4. Applying CSS properties to WebVTT Node Objects</a> <a href="#ref-for-webvtt-region-object-7">(2)</a> <a href="#ref-for-webvtt-region-object-8">(3)</a> <a href="#ref-for-webvtt-region-object-9">(4)</a>
+    <li><a href="#ref-for-webvtt-region-object-10">8.1. Introduction</a> <a href="#ref-for-webvtt-region-object-11">(2)</a>
+    <li><a href="#ref-for-webvtt-region-object-12">8.2.3. The ::cue-region pseudo-element</a> <a href="#ref-for-webvtt-region-object-13">(2)</a> <a href="#ref-for-webvtt-region-object-14">(3)</a> <a href="#ref-for-webvtt-region-object-15">(4)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="parse-a-percentage-string">
    <b><a href="#parse-a-percentage-string">#parse-a-percentage-string</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-parse-a-percentage-string-1">5.2. WebVTT region settings parsing</a> <a href="#ref-for-parse-a-percentage-string-2">(2)</a> <a href="#ref-for-parse-a-percentage-string-3">(3)</a> <a href="#ref-for-parse-a-percentage-string-4">(4)</a> <a href="#ref-for-parse-a-percentage-string-5">(5)</a>
-    <li><a href="#ref-for-parse-a-percentage-string-6">5.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-parse-a-percentage-string-7">(2)</a> <a href="#ref-for-parse-a-percentage-string-8">(3)</a>
+    <li><a href="#ref-for-parse-a-percentage-string-1">6.2. WebVTT region settings parsing</a> <a href="#ref-for-parse-a-percentage-string-2">(2)</a> <a href="#ref-for-parse-a-percentage-string-3">(3)</a> <a href="#ref-for-parse-a-percentage-string-4">(4)</a> <a href="#ref-for-parse-a-percentage-string-5">(5)</a>
+    <li><a href="#ref-for-parse-a-percentage-string-6">6.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-parse-a-percentage-string-7">(2)</a> <a href="#ref-for-parse-a-percentage-string-8">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="collect-webvtt-cue-timings-and-settings">
    <b><a href="#collect-webvtt-cue-timings-and-settings">#collect-webvtt-cue-timings-and-settings</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-collect-webvtt-cue-timings-and-settings-1">5.1. WebVTT file parsing</a>
+    <li><a href="#ref-for-collect-webvtt-cue-timings-and-settings-1">6.1. WebVTT file parsing</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="parse-the-webvtt-cue-settings">
    <b><a href="#parse-the-webvtt-cue-settings">#parse-the-webvtt-cue-settings</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-parse-the-webvtt-cue-settings-1">5.3. WebVTT cue timings and settings parsing</a>
+    <li><a href="#ref-for-parse-the-webvtt-cue-settings-1">6.3. WebVTT cue timings and settings parsing</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="collect-a-webvtt-timestamp">
    <b><a href="#collect-a-webvtt-timestamp">#collect-a-webvtt-timestamp</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-collect-a-webvtt-timestamp-1">5.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-collect-a-webvtt-timestamp-2">(2)</a>
-    <li><a href="#ref-for-collect-a-webvtt-timestamp-3">5.4. WebVTT cue text parsing rules</a>
+    <li><a href="#ref-for-collect-a-webvtt-timestamp-1">6.3. WebVTT cue timings and settings parsing</a> <a href="#ref-for-collect-a-webvtt-timestamp-2">(2)</a>
+    <li><a href="#ref-for-collect-a-webvtt-timestamp-3">6.4. WebVTT cue text parsing rules</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-node-object">
    <b><a href="#webvtt-node-object">#webvtt-node-object</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-node-object-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-node-object-2">(2)</a> <a href="#ref-for-webvtt-node-object-3">(3)</a> <a href="#ref-for-webvtt-node-object-4">(4)</a> <a href="#ref-for-webvtt-node-object-5">(5)</a>
-    <li><a href="#ref-for-webvtt-node-object-6">5.5. WebVTT cue text DOM construction rules</a> <a href="#ref-for-webvtt-node-object-7">(2)</a> <a href="#ref-for-webvtt-node-object-8">(3)</a>
-    <li><a href="#ref-for-webvtt-node-object-9">6.1. Processing model</a> <a href="#ref-for-webvtt-node-object-10">(2)</a>
-    <li><a href="#ref-for-webvtt-node-object-11">6.1.1. Applying CSS properties to WebVTT Node Objects</a> <a href="#ref-for-webvtt-node-object-12">(2)</a>
-    <li><a href="#ref-for-webvtt-node-object-13">7.2. Processing model</a> <a href="#ref-for-webvtt-node-object-14">(2)</a>
-    <li><a href="#ref-for-webvtt-node-object-15">7.2.1. The ::cue pseudo-element</a>
-    <li><a href="#ref-for-webvtt-node-object-16">7.2.2. The :past and :future pseudo-classes</a> <a href="#ref-for-webvtt-node-object-17">(2)</a> <a href="#ref-for-webvtt-node-object-18">(3)</a> <a href="#ref-for-webvtt-node-object-19">(4)</a> <a href="#ref-for-webvtt-node-object-20">(5)</a> <a href="#ref-for-webvtt-node-object-21">(6)</a> <a href="#ref-for-webvtt-node-object-22">(7)</a>
+    <li><a href="#ref-for-webvtt-node-object-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-node-object-2">(2)</a> <a href="#ref-for-webvtt-node-object-3">(3)</a> <a href="#ref-for-webvtt-node-object-4">(4)</a> <a href="#ref-for-webvtt-node-object-5">(5)</a>
+    <li><a href="#ref-for-webvtt-node-object-6">6.5. WebVTT cue text DOM construction rules</a> <a href="#ref-for-webvtt-node-object-7">(2)</a> <a href="#ref-for-webvtt-node-object-8">(3)</a>
+    <li><a href="#ref-for-webvtt-node-object-9">7.3. Obtaining CSS boxes</a> <a href="#ref-for-webvtt-node-object-10">(2)</a>
+    <li><a href="#ref-for-webvtt-node-object-11">7.4. Applying CSS properties to WebVTT Node Objects</a> <a href="#ref-for-webvtt-node-object-12">(2)</a>
+    <li><a href="#ref-for-webvtt-node-object-13">8.2. Processing model</a> <a href="#ref-for-webvtt-node-object-14">(2)</a>
+    <li><a href="#ref-for-webvtt-node-object-15">8.2.1. The ::cue pseudo-element</a>
+    <li><a href="#ref-for-webvtt-node-object-16">8.2.2. The :past and :future pseudo-classes</a> <a href="#ref-for-webvtt-node-object-17">(2)</a> <a href="#ref-for-webvtt-node-object-18">(3)</a> <a href="#ref-for-webvtt-node-object-19">(4)</a> <a href="#ref-for-webvtt-node-object-20">(5)</a> <a href="#ref-for-webvtt-node-object-21">(6)</a> <a href="#ref-for-webvtt-node-object-22">(7)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-internal-node-object">
    <b><a href="#webvtt-internal-node-object">#webvtt-internal-node-object</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-internal-node-object-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-internal-node-object-2">(2)</a> <a href="#ref-for-webvtt-internal-node-object-3">(3)</a> <a href="#ref-for-webvtt-internal-node-object-4">(4)</a> <a href="#ref-for-webvtt-internal-node-object-5">(5)</a> <a href="#ref-for-webvtt-internal-node-object-6">(6)</a> <a href="#ref-for-webvtt-internal-node-object-7">(7)</a>
-    <li><a href="#ref-for-webvtt-internal-node-object-8">5.5. WebVTT cue text DOM construction rules</a>
-    <li><a href="#ref-for-webvtt-internal-node-object-9">6.1. Processing model</a>
-    <li><a href="#ref-for-webvtt-internal-node-object-10">7.1. Introduction</a> <a href="#ref-for-webvtt-internal-node-object-11">(2)</a> <a href="#ref-for-webvtt-internal-node-object-12">(3)</a> <a href="#ref-for-webvtt-internal-node-object-13">(4)</a> <a href="#ref-for-webvtt-internal-node-object-14">(5)</a>
-    <li><a href="#ref-for-webvtt-internal-node-object-15">7.2.1. The ::cue pseudo-element</a> <a href="#ref-for-webvtt-internal-node-object-16">(2)</a> <a href="#ref-for-webvtt-internal-node-object-17">(3)</a> <a href="#ref-for-webvtt-internal-node-object-18">(4)</a> <a href="#ref-for-webvtt-internal-node-object-19">(5)</a> <a href="#ref-for-webvtt-internal-node-object-20">(6)</a> <a href="#ref-for-webvtt-internal-node-object-21">(7)</a>
+    <li><a href="#ref-for-webvtt-internal-node-object-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-internal-node-object-2">(2)</a> <a href="#ref-for-webvtt-internal-node-object-3">(3)</a> <a href="#ref-for-webvtt-internal-node-object-4">(4)</a> <a href="#ref-for-webvtt-internal-node-object-5">(5)</a> <a href="#ref-for-webvtt-internal-node-object-6">(6)</a> <a href="#ref-for-webvtt-internal-node-object-7">(7)</a>
+    <li><a href="#ref-for-webvtt-internal-node-object-8">6.5. WebVTT cue text DOM construction rules</a>
+    <li><a href="#ref-for-webvtt-internal-node-object-9">7.3. Obtaining CSS boxes</a>
+    <li><a href="#ref-for-webvtt-internal-node-object-10">8.1. Introduction</a> <a href="#ref-for-webvtt-internal-node-object-11">(2)</a> <a href="#ref-for-webvtt-internal-node-object-12">(3)</a> <a href="#ref-for-webvtt-internal-node-object-13">(4)</a> <a href="#ref-for-webvtt-internal-node-object-14">(5)</a>
+    <li><a href="#ref-for-webvtt-internal-node-object-15">8.2.1. The ::cue pseudo-element</a> <a href="#ref-for-webvtt-internal-node-object-16">(2)</a> <a href="#ref-for-webvtt-internal-node-object-17">(3)</a> <a href="#ref-for-webvtt-internal-node-object-18">(4)</a> <a href="#ref-for-webvtt-internal-node-object-19">(5)</a> <a href="#ref-for-webvtt-internal-node-object-20">(6)</a> <a href="#ref-for-webvtt-internal-node-object-21">(7)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-node-objects-applicable-classes">
    <b><a href="#webvtt-node-objects-applicable-classes">#webvtt-node-objects-applicable-classes</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-node-objects-applicable-classes-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-node-objects-applicable-classes-2">(2)</a>
-    <li><a href="#ref-for-webvtt-node-objects-applicable-classes-3">5.5. WebVTT cue text DOM construction rules</a>
-    <li><a href="#ref-for-webvtt-node-objects-applicable-classes-4">7.1. Introduction</a>
-    <li><a href="#ref-for-webvtt-node-objects-applicable-classes-5">7.2.1. The ::cue pseudo-element</a>
+    <li><a href="#ref-for-webvtt-node-objects-applicable-classes-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-node-objects-applicable-classes-2">(2)</a>
+    <li><a href="#ref-for-webvtt-node-objects-applicable-classes-3">6.5. WebVTT cue text DOM construction rules</a>
+    <li><a href="#ref-for-webvtt-node-objects-applicable-classes-4">8.1. Introduction</a>
+    <li><a href="#ref-for-webvtt-node-objects-applicable-classes-5">8.2.1. The ::cue pseudo-element</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-node-objects-applicable-language">
    <b><a href="#webvtt-node-objects-applicable-language">#webvtt-node-objects-applicable-language</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-node-objects-applicable-language-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-node-objects-applicable-language-2">(2)</a> <a href="#ref-for-webvtt-node-objects-applicable-language-3">(3)</a> <a href="#ref-for-webvtt-node-objects-applicable-language-4">(4)</a>
-    <li><a href="#ref-for-webvtt-node-objects-applicable-language-5">5.5. WebVTT cue text DOM construction rules</a>
-    <li><a href="#ref-for-webvtt-node-objects-applicable-language-6">7.1. Introduction</a> <a href="#ref-for-webvtt-node-objects-applicable-language-7">(2)</a> <a href="#ref-for-webvtt-node-objects-applicable-language-8">(3)</a> <a href="#ref-for-webvtt-node-objects-applicable-language-9">(4)</a>
-    <li><a href="#ref-for-webvtt-node-objects-applicable-language-10">7.2.1. The ::cue pseudo-element</a> <a href="#ref-for-webvtt-node-objects-applicable-language-11">(2)</a> <a href="#ref-for-webvtt-node-objects-applicable-language-12">(3)</a> <a href="#ref-for-webvtt-node-objects-applicable-language-13">(4)</a>
+    <li><a href="#ref-for-webvtt-node-objects-applicable-language-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-node-objects-applicable-language-2">(2)</a> <a href="#ref-for-webvtt-node-objects-applicable-language-3">(3)</a> <a href="#ref-for-webvtt-node-objects-applicable-language-4">(4)</a>
+    <li><a href="#ref-for-webvtt-node-objects-applicable-language-5">6.5. WebVTT cue text DOM construction rules</a>
+    <li><a href="#ref-for-webvtt-node-objects-applicable-language-6">8.1. Introduction</a> <a href="#ref-for-webvtt-node-objects-applicable-language-7">(2)</a> <a href="#ref-for-webvtt-node-objects-applicable-language-8">(3)</a> <a href="#ref-for-webvtt-node-objects-applicable-language-9">(4)</a>
+    <li><a href="#ref-for-webvtt-node-objects-applicable-language-10">8.2.1. The ::cue pseudo-element</a> <a href="#ref-for-webvtt-node-objects-applicable-language-11">(2)</a> <a href="#ref-for-webvtt-node-objects-applicable-language-12">(3)</a> <a href="#ref-for-webvtt-node-objects-applicable-language-13">(4)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="list-of-webvtt-node-objects">
    <b><a href="#list-of-webvtt-node-objects">#list-of-webvtt-node-objects</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-list-of-webvtt-node-objects-1">5.2. WebVTT region settings parsing</a>
-    <li><a href="#ref-for-list-of-webvtt-node-objects-2">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-list-of-webvtt-node-objects-3">(2)</a>
-    <li><a href="#ref-for-list-of-webvtt-node-objects-4">5.5. WebVTT cue text DOM construction rules</a> <a href="#ref-for-list-of-webvtt-node-objects-5">(2)</a>
-    <li><a href="#ref-for-list-of-webvtt-node-objects-6">5.6. WebVTT rules for extracting the chapter
+    <li><a href="#ref-for-list-of-webvtt-node-objects-1">6.2. WebVTT region settings parsing</a>
+    <li><a href="#ref-for-list-of-webvtt-node-objects-2">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-list-of-webvtt-node-objects-3">(2)</a>
+    <li><a href="#ref-for-list-of-webvtt-node-objects-4">6.5. WebVTT cue text DOM construction rules</a> <a href="#ref-for-list-of-webvtt-node-objects-5">(2)</a>
+    <li><a href="#ref-for-list-of-webvtt-node-objects-6">6.6. WebVTT rules for extracting the chapter
 title</a>
-    <li><a href="#ref-for-list-of-webvtt-node-objects-7">6.1. Processing model</a> <a href="#ref-for-list-of-webvtt-node-objects-8">(2)</a>
-    <li><a href="#ref-for-list-of-webvtt-node-objects-9">6.1.1. Applying CSS properties to WebVTT Node Objects</a> <a href="#ref-for-list-of-webvtt-node-objects-10">(2)</a> <a href="#ref-for-list-of-webvtt-node-objects-11">(3)</a> <a href="#ref-for-list-of-webvtt-node-objects-12">(4)</a> <a href="#ref-for-list-of-webvtt-node-objects-13">(5)</a> <a href="#ref-for-list-of-webvtt-node-objects-14">(6)</a> <a href="#ref-for-list-of-webvtt-node-objects-15">(7)</a> <a href="#ref-for-list-of-webvtt-node-objects-16">(8)</a> <a href="#ref-for-list-of-webvtt-node-objects-17">(9)</a>
-    <li><a href="#ref-for-list-of-webvtt-node-objects-18">7.1. Introduction</a> <a href="#ref-for-list-of-webvtt-node-objects-19">(2)</a> <a href="#ref-for-list-of-webvtt-node-objects-20">(3)</a> <a href="#ref-for-list-of-webvtt-node-objects-21">(4)</a> <a href="#ref-for-list-of-webvtt-node-objects-22">(5)</a> <a href="#ref-for-list-of-webvtt-node-objects-23">(6)</a> <a href="#ref-for-list-of-webvtt-node-objects-24">(7)</a>
-    <li><a href="#ref-for-list-of-webvtt-node-objects-25">7.2. Processing model</a>
-    <li><a href="#ref-for-list-of-webvtt-node-objects-26">7.2.1. The ::cue pseudo-element</a> <a href="#ref-for-list-of-webvtt-node-objects-27">(2)</a> <a href="#ref-for-list-of-webvtt-node-objects-28">(3)</a> <a href="#ref-for-list-of-webvtt-node-objects-29">(4)</a> <a href="#ref-for-list-of-webvtt-node-objects-30">(5)</a> <a href="#ref-for-list-of-webvtt-node-objects-31">(6)</a> <a href="#ref-for-list-of-webvtt-node-objects-32">(7)</a>
-    <li><a href="#ref-for-list-of-webvtt-node-objects-33">7.2.2. The :past and :future pseudo-classes</a> <a href="#ref-for-list-of-webvtt-node-objects-34">(2)</a>
+    <li><a href="#ref-for-list-of-webvtt-node-objects-7">7.1. Processing model</a>
+    <li><a href="#ref-for-list-of-webvtt-node-objects-8">7.2. Processing cue settings</a>
+    <li><a href="#ref-for-list-of-webvtt-node-objects-9">7.4. Applying CSS properties to WebVTT Node Objects</a> <a href="#ref-for-list-of-webvtt-node-objects-10">(2)</a> <a href="#ref-for-list-of-webvtt-node-objects-11">(3)</a> <a href="#ref-for-list-of-webvtt-node-objects-12">(4)</a> <a href="#ref-for-list-of-webvtt-node-objects-13">(5)</a> <a href="#ref-for-list-of-webvtt-node-objects-14">(6)</a> <a href="#ref-for-list-of-webvtt-node-objects-15">(7)</a> <a href="#ref-for-list-of-webvtt-node-objects-16">(8)</a> <a href="#ref-for-list-of-webvtt-node-objects-17">(9)</a>
+    <li><a href="#ref-for-list-of-webvtt-node-objects-18">8.1. Introduction</a> <a href="#ref-for-list-of-webvtt-node-objects-19">(2)</a> <a href="#ref-for-list-of-webvtt-node-objects-20">(3)</a> <a href="#ref-for-list-of-webvtt-node-objects-21">(4)</a> <a href="#ref-for-list-of-webvtt-node-objects-22">(5)</a> <a href="#ref-for-list-of-webvtt-node-objects-23">(6)</a> <a href="#ref-for-list-of-webvtt-node-objects-24">(7)</a>
+    <li><a href="#ref-for-list-of-webvtt-node-objects-25">8.2. Processing model</a>
+    <li><a href="#ref-for-list-of-webvtt-node-objects-26">8.2.1. The ::cue pseudo-element</a> <a href="#ref-for-list-of-webvtt-node-objects-27">(2)</a> <a href="#ref-for-list-of-webvtt-node-objects-28">(3)</a> <a href="#ref-for-list-of-webvtt-node-objects-29">(4)</a> <a href="#ref-for-list-of-webvtt-node-objects-30">(5)</a> <a href="#ref-for-list-of-webvtt-node-objects-31">(6)</a> <a href="#ref-for-list-of-webvtt-node-objects-32">(7)</a>
+    <li><a href="#ref-for-list-of-webvtt-node-objects-33">8.2.2. The :past and :future pseudo-classes</a> <a href="#ref-for-list-of-webvtt-node-objects-34">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-class-object">
    <b><a href="#webvtt-class-object">#webvtt-class-object</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-class-object-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-class-object-2">(2)</a>
-    <li><a href="#ref-for-webvtt-class-object-3">5.5. WebVTT cue text DOM construction rules</a>
-    <li><a href="#ref-for-webvtt-class-object-4">7.2.1. The ::cue pseudo-element</a>
+    <li><a href="#ref-for-webvtt-class-object-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-class-object-2">(2)</a>
+    <li><a href="#ref-for-webvtt-class-object-3">6.5. WebVTT cue text DOM construction rules</a>
+    <li><a href="#ref-for-webvtt-class-object-4">8.2.1. The ::cue pseudo-element</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-italic-object">
    <b><a href="#webvtt-italic-object">#webvtt-italic-object</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-italic-object-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-italic-object-2">(2)</a>
-    <li><a href="#ref-for-webvtt-italic-object-3">5.5. WebVTT cue text DOM construction rules</a>
-    <li><a href="#ref-for-webvtt-italic-object-4">6.1.1. Applying CSS properties to WebVTT Node Objects</a>
-    <li><a href="#ref-for-webvtt-italic-object-5">7.2.1. The ::cue pseudo-element</a>
+    <li><a href="#ref-for-webvtt-italic-object-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-italic-object-2">(2)</a>
+    <li><a href="#ref-for-webvtt-italic-object-3">6.5. WebVTT cue text DOM construction rules</a>
+    <li><a href="#ref-for-webvtt-italic-object-4">7.4. Applying CSS properties to WebVTT Node Objects</a>
+    <li><a href="#ref-for-webvtt-italic-object-5">8.2.1. The ::cue pseudo-element</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-bold-object">
    <b><a href="#webvtt-bold-object">#webvtt-bold-object</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-bold-object-1">1.3. Styling</a>
-    <li><a href="#ref-for-webvtt-bold-object-2">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-bold-object-3">(2)</a>
-    <li><a href="#ref-for-webvtt-bold-object-4">5.5. WebVTT cue text DOM construction rules</a>
-    <li><a href="#ref-for-webvtt-bold-object-5">6.1.1. Applying CSS properties to WebVTT Node Objects</a>
-    <li><a href="#ref-for-webvtt-bold-object-6">7.2.1. The ::cue pseudo-element</a>
+    <li><a href="#ref-for-webvtt-bold-object-1">1.3. Styling captions</a>
+    <li><a href="#ref-for-webvtt-bold-object-2">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-bold-object-3">(2)</a>
+    <li><a href="#ref-for-webvtt-bold-object-4">6.5. WebVTT cue text DOM construction rules</a>
+    <li><a href="#ref-for-webvtt-bold-object-5">7.4. Applying CSS properties to WebVTT Node Objects</a>
+    <li><a href="#ref-for-webvtt-bold-object-6">8.2.1. The ::cue pseudo-element</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-underline-object">
    <b><a href="#webvtt-underline-object">#webvtt-underline-object</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-underline-object-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-underline-object-2">(2)</a>
-    <li><a href="#ref-for-webvtt-underline-object-3">5.5. WebVTT cue text DOM construction rules</a>
-    <li><a href="#ref-for-webvtt-underline-object-4">6.1.1. Applying CSS properties to WebVTT Node Objects</a>
-    <li><a href="#ref-for-webvtt-underline-object-5">7.2.1. The ::cue pseudo-element</a>
+    <li><a href="#ref-for-webvtt-underline-object-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-underline-object-2">(2)</a>
+    <li><a href="#ref-for-webvtt-underline-object-3">6.5. WebVTT cue text DOM construction rules</a>
+    <li><a href="#ref-for-webvtt-underline-object-4">7.4. Applying CSS properties to WebVTT Node Objects</a>
+    <li><a href="#ref-for-webvtt-underline-object-5">8.2.1. The ::cue pseudo-element</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-ruby-object">
    <b><a href="#webvtt-ruby-object">#webvtt-ruby-object</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-ruby-object-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-ruby-object-2">(2)</a> <a href="#ref-for-webvtt-ruby-object-3">(3)</a>
-    <li><a href="#ref-for-webvtt-ruby-object-4">5.5. WebVTT cue text DOM construction rules</a>
-    <li><a href="#ref-for-webvtt-ruby-object-5">6.1. Processing model</a>
-    <li><a href="#ref-for-webvtt-ruby-object-6">6.1.1. Applying CSS properties to WebVTT Node Objects</a>
-    <li><a href="#ref-for-webvtt-ruby-object-7">7.2.1. The ::cue pseudo-element</a>
+    <li><a href="#ref-for-webvtt-ruby-object-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-ruby-object-2">(2)</a> <a href="#ref-for-webvtt-ruby-object-3">(3)</a>
+    <li><a href="#ref-for-webvtt-ruby-object-4">6.5. WebVTT cue text DOM construction rules</a>
+    <li><a href="#ref-for-webvtt-ruby-object-5">7.3. Obtaining CSS boxes</a>
+    <li><a href="#ref-for-webvtt-ruby-object-6">7.4. Applying CSS properties to WebVTT Node Objects</a>
+    <li><a href="#ref-for-webvtt-ruby-object-7">8.2.1. The ::cue pseudo-element</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-ruby-text-object">
    <b><a href="#webvtt-ruby-text-object">#webvtt-ruby-text-object</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-ruby-text-object-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-ruby-text-object-2">(2)</a> <a href="#ref-for-webvtt-ruby-text-object-3">(3)</a>
-    <li><a href="#ref-for-webvtt-ruby-text-object-4">5.5. WebVTT cue text DOM construction rules</a>
-    <li><a href="#ref-for-webvtt-ruby-text-object-5">5.6. WebVTT rules for extracting the chapter
+    <li><a href="#ref-for-webvtt-ruby-text-object-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-ruby-text-object-2">(2)</a> <a href="#ref-for-webvtt-ruby-text-object-3">(3)</a>
+    <li><a href="#ref-for-webvtt-ruby-text-object-4">6.5. WebVTT cue text DOM construction rules</a>
+    <li><a href="#ref-for-webvtt-ruby-text-object-5">6.6. WebVTT rules for extracting the chapter
 title</a>
-    <li><a href="#ref-for-webvtt-ruby-text-object-6">6.1. Processing model</a>
-    <li><a href="#ref-for-webvtt-ruby-text-object-7">6.1.1. Applying CSS properties to WebVTT Node Objects</a> <a href="#ref-for-webvtt-ruby-text-object-8">(2)</a>
-    <li><a href="#ref-for-webvtt-ruby-text-object-9">7.2.1. The ::cue pseudo-element</a>
+    <li><a href="#ref-for-webvtt-ruby-text-object-6">7.3. Obtaining CSS boxes</a>
+    <li><a href="#ref-for-webvtt-ruby-text-object-7">7.4. Applying CSS properties to WebVTT Node Objects</a> <a href="#ref-for-webvtt-ruby-text-object-8">(2)</a>
+    <li><a href="#ref-for-webvtt-ruby-text-object-9">8.2.1. The ::cue pseudo-element</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-voice-object">
    <b><a href="#webvtt-voice-object">#webvtt-voice-object</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-voice-object-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-voice-object-2">(2)</a> <a href="#ref-for-webvtt-voice-object-3">(3)</a>
-    <li><a href="#ref-for-webvtt-voice-object-4">5.5. WebVTT cue text DOM construction rules</a> <a href="#ref-for-webvtt-voice-object-5">(2)</a>
-    <li><a href="#ref-for-webvtt-voice-object-6">7.1. Introduction</a>
-    <li><a href="#ref-for-webvtt-voice-object-7">7.2.1. The ::cue pseudo-element</a> <a href="#ref-for-webvtt-voice-object-8">(2)</a> <a href="#ref-for-webvtt-voice-object-9">(3)</a>
+    <li><a href="#ref-for-webvtt-voice-object-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-voice-object-2">(2)</a> <a href="#ref-for-webvtt-voice-object-3">(3)</a>
+    <li><a href="#ref-for-webvtt-voice-object-4">6.5. WebVTT cue text DOM construction rules</a> <a href="#ref-for-webvtt-voice-object-5">(2)</a>
+    <li><a href="#ref-for-webvtt-voice-object-6">8.1. Introduction</a>
+    <li><a href="#ref-for-webvtt-voice-object-7">8.2.1. The ::cue pseudo-element</a> <a href="#ref-for-webvtt-voice-object-8">(2)</a> <a href="#ref-for-webvtt-voice-object-9">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-language-object">
    <b><a href="#webvtt-language-object">#webvtt-language-object</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-language-object-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-language-object-2">(2)</a>
-    <li><a href="#ref-for-webvtt-language-object-3">5.5. WebVTT cue text DOM construction rules</a> <a href="#ref-for-webvtt-language-object-4">(2)</a>
-    <li><a href="#ref-for-webvtt-language-object-5">7.1. Introduction</a>
-    <li><a href="#ref-for-webvtt-language-object-6">7.2.1. The ::cue pseudo-element</a> <a href="#ref-for-webvtt-language-object-7">(2)</a>
+    <li><a href="#ref-for-webvtt-language-object-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-language-object-2">(2)</a>
+    <li><a href="#ref-for-webvtt-language-object-3">6.5. WebVTT cue text DOM construction rules</a> <a href="#ref-for-webvtt-language-object-4">(2)</a>
+    <li><a href="#ref-for-webvtt-language-object-5">8.1. Introduction</a>
+    <li><a href="#ref-for-webvtt-language-object-6">8.2.1. The ::cue pseudo-element</a> <a href="#ref-for-webvtt-language-object-7">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-leaf-node-object">
    <b><a href="#webvtt-leaf-node-object">#webvtt-leaf-node-object</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-leaf-node-object-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-leaf-node-object-2">(2)</a>
-    <li><a href="#ref-for-webvtt-leaf-node-object-3">7.2.1. The ::cue pseudo-element</a>
+    <li><a href="#ref-for-webvtt-leaf-node-object-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-leaf-node-object-2">(2)</a>
+    <li><a href="#ref-for-webvtt-leaf-node-object-3">8.2.1. The ::cue pseudo-element</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-text-object">
    <b><a href="#webvtt-text-object">#webvtt-text-object</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-text-object-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-text-object-2">(2)</a> <a href="#ref-for-webvtt-text-object-3">(3)</a>
-    <li><a href="#ref-for-webvtt-text-object-4">5.5. WebVTT cue text DOM construction rules</a> <a href="#ref-for-webvtt-text-object-5">(2)</a>
-    <li><a href="#ref-for-webvtt-text-object-6">5.6. WebVTT rules for extracting the chapter
+    <li><a href="#ref-for-webvtt-text-object-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-text-object-2">(2)</a> <a href="#ref-for-webvtt-text-object-3">(3)</a>
+    <li><a href="#ref-for-webvtt-text-object-4">6.5. WebVTT cue text DOM construction rules</a> <a href="#ref-for-webvtt-text-object-5">(2)</a>
+    <li><a href="#ref-for-webvtt-text-object-6">6.6. WebVTT rules for extracting the chapter
 title</a>
-    <li><a href="#ref-for-webvtt-text-object-7">6.1. Processing model</a>
+    <li><a href="#ref-for-webvtt-text-object-7">7.3. Obtaining CSS boxes</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-timestamp-object">
    <b><a href="#webvtt-timestamp-object">#webvtt-timestamp-object</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-timestamp-object-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-timestamp-object-2">(2)</a>
-    <li><a href="#ref-for-webvtt-timestamp-object-3">5.5. WebVTT cue text DOM construction rules</a> <a href="#ref-for-webvtt-timestamp-object-4">(2)</a>
-    <li><a href="#ref-for-webvtt-timestamp-object-5">7.1. Introduction</a>
-    <li><a href="#ref-for-webvtt-timestamp-object-6">7.2.2. The :past and :future pseudo-classes</a> <a href="#ref-for-webvtt-timestamp-object-7">(2)</a>
+    <li><a href="#ref-for-webvtt-timestamp-object-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-timestamp-object-2">(2)</a>
+    <li><a href="#ref-for-webvtt-timestamp-object-3">6.5. WebVTT cue text DOM construction rules</a> <a href="#ref-for-webvtt-timestamp-object-4">(2)</a>
+    <li><a href="#ref-for-webvtt-timestamp-object-5">8.1. Introduction</a>
+    <li><a href="#ref-for-webvtt-timestamp-object-6">8.2.2. The :past and :future pseudo-classes</a> <a href="#ref-for-webvtt-timestamp-object-7">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-text-parsing-rules">
    <b><a href="#webvtt-cue-text-parsing-rules">#webvtt-cue-text-parsing-rules</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-text-parsing-rules-1">5.6. WebVTT rules for extracting the chapter
+    <li><a href="#ref-for-webvtt-cue-text-parsing-rules-1">6.6. WebVTT rules for extracting the chapter
 title</a>
-    <li><a href="#ref-for-webvtt-cue-text-parsing-rules-2">6.1. Processing model</a>
-    <li><a href="#ref-for-webvtt-cue-text-parsing-rules-3">8.1. The VTTCue interface</a>
+    <li><a href="#ref-for-webvtt-cue-text-parsing-rules-2">7.1. Processing model</a>
+    <li><a href="#ref-for-webvtt-cue-text-parsing-rules-3">9.1. The VTTCue interface</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="attach-a-webvtt-internal-node-object">
    <b><a href="#attach-a-webvtt-internal-node-object">#attach-a-webvtt-internal-node-object</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-attach-a-webvtt-internal-node-object-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-attach-a-webvtt-internal-node-object-2">(2)</a> <a href="#ref-for-attach-a-webvtt-internal-node-object-3">(3)</a> <a href="#ref-for-attach-a-webvtt-internal-node-object-4">(4)</a> <a href="#ref-for-attach-a-webvtt-internal-node-object-5">(5)</a> <a href="#ref-for-attach-a-webvtt-internal-node-object-6">(6)</a> <a href="#ref-for-attach-a-webvtt-internal-node-object-7">(7)</a> <a href="#ref-for-attach-a-webvtt-internal-node-object-8">(8)</a>
+    <li><a href="#ref-for-attach-a-webvtt-internal-node-object-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-attach-a-webvtt-internal-node-object-2">(2)</a> <a href="#ref-for-attach-a-webvtt-internal-node-object-3">(3)</a> <a href="#ref-for-attach-a-webvtt-internal-node-object-4">(4)</a> <a href="#ref-for-attach-a-webvtt-internal-node-object-5">(5)</a> <a href="#ref-for-attach-a-webvtt-internal-node-object-6">(6)</a> <a href="#ref-for-attach-a-webvtt-internal-node-object-7">(7)</a> <a href="#ref-for-attach-a-webvtt-internal-node-object-8">(8)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-text-tokenizer">
    <b><a href="#webvtt-cue-text-tokenizer">#webvtt-cue-text-tokenizer</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-text-tokenizer-1">5.4. WebVTT cue text parsing rules</a>
+    <li><a href="#ref-for-webvtt-cue-text-tokenizer-1">6.4. WebVTT cue text parsing rules</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-data-state">
    <b><a href="#webvtt-data-state">#webvtt-data-state</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-data-state-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-data-state-2">(2)</a>
+    <li><a href="#ref-for-webvtt-data-state-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-data-state-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="html-character-reference-in-data-state">
    <b><a href="#html-character-reference-in-data-state">#html-character-reference-in-data-state</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-html-character-reference-in-data-state-1">5.4. WebVTT cue text parsing rules</a>
+    <li><a href="#ref-for-html-character-reference-in-data-state-1">6.4. WebVTT cue text parsing rules</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-tag-state">
    <b><a href="#webvtt-tag-state">#webvtt-tag-state</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-tag-state-1">5.4. WebVTT cue text parsing rules</a>
+    <li><a href="#ref-for-webvtt-tag-state-1">6.4. WebVTT cue text parsing rules</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-start-tag-state">
    <b><a href="#webvtt-start-tag-state">#webvtt-start-tag-state</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-start-tag-state-1">5.4. WebVTT cue text parsing rules</a>
+    <li><a href="#ref-for-webvtt-start-tag-state-1">6.4. WebVTT cue text parsing rules</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-start-tag-class-state">
    <b><a href="#webvtt-start-tag-class-state">#webvtt-start-tag-class-state</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-start-tag-class-state-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-start-tag-class-state-2">(2)</a>
+    <li><a href="#ref-for-webvtt-start-tag-class-state-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-start-tag-class-state-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-start-tag-annotation-state">
    <b><a href="#webvtt-start-tag-annotation-state">#webvtt-start-tag-annotation-state</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-start-tag-annotation-state-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-start-tag-annotation-state-2">(2)</a> <a href="#ref-for-webvtt-start-tag-annotation-state-3">(3)</a> <a href="#ref-for-webvtt-start-tag-annotation-state-4">(4)</a> <a href="#ref-for-webvtt-start-tag-annotation-state-5">(5)</a> <a href="#ref-for-webvtt-start-tag-annotation-state-6">(6)</a>
+    <li><a href="#ref-for-webvtt-start-tag-annotation-state-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-webvtt-start-tag-annotation-state-2">(2)</a> <a href="#ref-for-webvtt-start-tag-annotation-state-3">(3)</a> <a href="#ref-for-webvtt-start-tag-annotation-state-4">(4)</a> <a href="#ref-for-webvtt-start-tag-annotation-state-5">(5)</a> <a href="#ref-for-webvtt-start-tag-annotation-state-6">(6)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="html-character-reference-in-annotation-state">
    <b><a href="#html-character-reference-in-annotation-state">#html-character-reference-in-annotation-state</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-html-character-reference-in-annotation-state-1">5.4. WebVTT cue text parsing rules</a>
+    <li><a href="#ref-for-html-character-reference-in-annotation-state-1">6.4. WebVTT cue text parsing rules</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-end-tag-state">
    <b><a href="#webvtt-end-tag-state">#webvtt-end-tag-state</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-end-tag-state-1">5.4. WebVTT cue text parsing rules</a>
+    <li><a href="#ref-for-webvtt-end-tag-state-1">6.4. WebVTT cue text parsing rules</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-timestamp-tag-state">
    <b><a href="#webvtt-timestamp-tag-state">#webvtt-timestamp-tag-state</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-timestamp-tag-state-1">5.4. WebVTT cue text parsing rules</a>
+    <li><a href="#ref-for-webvtt-timestamp-tag-state-1">6.4. WebVTT cue text parsing rules</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="consume-an-html-character-reference">
    <b><a href="#consume-an-html-character-reference">#consume-an-html-character-reference</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-consume-an-html-character-reference-1">5.4. WebVTT cue text parsing rules</a> <a href="#ref-for-consume-an-html-character-reference-2">(2)</a>
+    <li><a href="#ref-for-consume-an-html-character-reference-1">6.4. WebVTT cue text parsing rules</a> <a href="#ref-for-consume-an-html-character-reference-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-text-dom-construction-rules">
    <b><a href="#webvtt-cue-text-dom-construction-rules">#webvtt-cue-text-dom-construction-rules</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-text-dom-construction-rules-1">8.1. The VTTCue interface</a>
+    <li><a href="#ref-for-webvtt-cue-text-dom-construction-rules-1">9.1. The VTTCue interface</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-rules-for-extracting-the-chapter-title">
    <b><a href="#webvtt-rules-for-extracting-the-chapter-title">#webvtt-rules-for-extracting-the-chapter-title</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-rules-for-extracting-the-chapter-title-1">8.1. The VTTCue interface</a>
+    <li><a href="#ref-for-webvtt-rules-for-extracting-the-chapter-title-1">9.1. The VTTCue interface</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="rules-for-updating-the-display-of-webvtt-text-tracks">
    <b><a href="#rules-for-updating-the-display-of-webvtt-text-tracks">#rules-for-updating-the-display-of-webvtt-text-tracks</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-1">3.1. WebVTT cues</a> <a href="#ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-2">(2)</a>
-    <li><a href="#ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-3">6.1. Processing model</a>
-    <li><a href="#ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-4">6.1.1. Applying CSS properties to WebVTT Node Objects</a> <a href="#ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-5">(2)</a> <a href="#ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-6">(3)</a>
-    <li><a href="#ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-7">7.2. Processing model</a> <a href="#ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-8">(2)</a>
-    <li><a href="#ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-9">7.2.3. The ::cue-region pseudo-element</a>
+    <li><a href="#ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-1">3.3. WebVTT caption or subtitle cues</a> <a href="#ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-2">(2)</a>
+    <li><a href="#ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-3">7.1. Processing model</a>
+    <li><a href="#ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-4">7.4. Applying CSS properties to WebVTT Node Objects</a> <a href="#ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-5">(2)</a> <a href="#ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-6">(3)</a>
+    <li><a href="#ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-7">8.2. Processing model</a> <a href="#ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-8">(2)</a>
+    <li><a href="#ref-for-rules-for-updating-the-display-of-webvtt-text-tracks-9">8.2.3. The ::cue-region pseudo-element</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="apply-webvtt-cue-settings">
    <b><a href="#apply-webvtt-cue-settings">#apply-webvtt-cue-settings</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-apply-webvtt-cue-settings-1">6.1. Processing model</a>
+    <li><a href="#ref-for-apply-webvtt-cue-settings-1">7.1. Processing model</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="obtain-a-set-of-css-boxes">
+   <b><a href="#obtain-a-set-of-css-boxes">#obtain-a-set-of-css-boxes</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-obtain-a-set-of-css-boxes-1">7.1. Processing model</a>
+    <li><a href="#ref-for-obtain-a-set-of-css-boxes-2">7.2. Processing cue settings</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="webvtt-cue-background-box">
    <b><a href="#webvtt-cue-background-box">#webvtt-cue-background-box</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-webvtt-cue-background-box-1">6.1.1. Applying CSS properties to WebVTT Node Objects</a>
-    <li><a href="#ref-for-webvtt-cue-background-box-2">7.2.1. The ::cue pseudo-element</a> <a href="#ref-for-webvtt-cue-background-box-3">(2)</a>
+    <li><a href="#ref-for-webvtt-cue-background-box-1">7.4. Applying CSS properties to WebVTT Node Objects</a>
+    <li><a href="#ref-for-webvtt-cue-background-box-2">8.2.1. The ::cue pseudo-element</a> <a href="#ref-for-webvtt-cue-background-box-3">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="enumdef-autokeyword">
    <b><a href="#enumdef-autokeyword">#enumdef-autokeyword</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-enumdef-autokeyword-1">8.1. The VTTCue interface</a>
+    <li><a href="#ref-for-enumdef-autokeyword-1">9.1. The VTTCue interface</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="typedefdef-lineandpositionsetting">
    <b><a href="#typedefdef-lineandpositionsetting">#typedefdef-lineandpositionsetting</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-typedefdef-lineandpositionsetting-1">8.1. The VTTCue interface</a> <a href="#ref-for-typedefdef-lineandpositionsetting-2">(2)</a>
+    <li><a href="#ref-for-typedefdef-lineandpositionsetting-1">9.1. The VTTCue interface</a> <a href="#ref-for-typedefdef-lineandpositionsetting-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="enumdef-directionsetting">
    <b><a href="#enumdef-directionsetting">#enumdef-directionsetting</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-enumdef-directionsetting-1">8.1. The VTTCue interface</a>
+    <li><a href="#ref-for-enumdef-directionsetting-1">9.1. The VTTCue interface</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="enumdef-linealignsetting">
    <b><a href="#enumdef-linealignsetting">#enumdef-linealignsetting</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-enumdef-linealignsetting-1">8.1. The VTTCue interface</a>
+    <li><a href="#ref-for-enumdef-linealignsetting-1">9.1. The VTTCue interface</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="enumdef-positionalignsetting">
    <b><a href="#enumdef-positionalignsetting">#enumdef-positionalignsetting</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-enumdef-positionalignsetting-1">8.1. The VTTCue interface</a>
+    <li><a href="#ref-for-enumdef-positionalignsetting-1">9.1. The VTTCue interface</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="enumdef-alignsetting">
    <b><a href="#enumdef-alignsetting">#enumdef-alignsetting</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-enumdef-alignsetting-1">8.1. The VTTCue interface</a>
+    <li><a href="#ref-for-enumdef-alignsetting-1">9.1. The VTTCue interface</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="vttcue">
    <b><a href="#vttcue">#vttcue</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-vttcue-1">5.5. WebVTT cue text DOM construction rules</a>
-    <li><a href="#ref-for-vttcue-2">8.1. The VTTCue interface</a> <a href="#ref-for-vttcue-3">(2)</a> <a href="#ref-for-vttcue-4">(3)</a> <a href="#ref-for-vttcue-5">(4)</a> <a href="#ref-for-vttcue-6">(5)</a> <a href="#ref-for-vttcue-7">(6)</a> <a href="#ref-for-vttcue-8">(7)</a> <a href="#ref-for-vttcue-9">(8)</a> <a href="#ref-for-vttcue-10">(9)</a> <a href="#ref-for-vttcue-11">(10)</a> <a href="#ref-for-vttcue-12">(11)</a> <a href="#ref-for-vttcue-13">(12)</a> <a href="#ref-for-vttcue-14">(13)</a>
+    <li><a href="#ref-for-vttcue-1">6.5. WebVTT cue text DOM construction rules</a>
+    <li><a href="#ref-for-vttcue-2">9.1. The VTTCue interface</a> <a href="#ref-for-vttcue-3">(2)</a> <a href="#ref-for-vttcue-4">(3)</a> <a href="#ref-for-vttcue-5">(4)</a> <a href="#ref-for-vttcue-6">(5)</a> <a href="#ref-for-vttcue-7">(6)</a> <a href="#ref-for-vttcue-8">(7)</a> <a href="#ref-for-vttcue-9">(8)</a> <a href="#ref-for-vttcue-10">(9)</a> <a href="#ref-for-vttcue-11">(10)</a> <a href="#ref-for-vttcue-12">(11)</a> <a href="#ref-for-vttcue-13">(12)</a> <a href="#ref-for-vttcue-14">(13)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttcue-vttcue">
    <b><a href="#dom-vttcue-vttcue">#dom-vttcue-vttcue</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttcue-vttcue-1">8.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-vttcue-2">(2)</a>
+    <li><a href="#ref-for-dom-vttcue-vttcue-1">9.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-vttcue-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttcue-region">
    <b><a href="#dom-vttcue-region">#dom-vttcue-region</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttcue-region-1">8.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-region-2">(2)</a>
+    <li><a href="#ref-for-dom-vttcue-region-1">9.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-region-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttcue-vertical">
    <b><a href="#dom-vttcue-vertical">#dom-vttcue-vertical</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttcue-vertical-1">8.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-vertical-2">(2)</a> <a href="#ref-for-dom-vttcue-vertical-3">(3)</a>
+    <li><a href="#ref-for-dom-vttcue-vertical-1">9.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-vertical-2">(2)</a> <a href="#ref-for-dom-vttcue-vertical-3">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttcue-snaptolines">
    <b><a href="#dom-vttcue-snaptolines">#dom-vttcue-snaptolines</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttcue-snaptolines-1">3.1. WebVTT cues</a>
-    <li><a href="#ref-for-dom-vttcue-snaptolines-2">8.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-snaptolines-3">(2)</a> <a href="#ref-for-dom-vttcue-snaptolines-4">(3)</a> <a href="#ref-for-dom-vttcue-snaptolines-5">(4)</a>
+    <li><a href="#ref-for-dom-vttcue-snaptolines-1">3.3. WebVTT caption or subtitle cues</a>
+    <li><a href="#ref-for-dom-vttcue-snaptolines-2">9.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-snaptolines-3">(2)</a> <a href="#ref-for-dom-vttcue-snaptolines-4">(3)</a> <a href="#ref-for-dom-vttcue-snaptolines-5">(4)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttcue-line">
    <b><a href="#dom-vttcue-line">#dom-vttcue-line</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttcue-line-1">3.1. WebVTT cues</a>
-    <li><a href="#ref-for-dom-vttcue-line-2">8.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-line-3">(2)</a> <a href="#ref-for-dom-vttcue-line-4">(3)</a> <a href="#ref-for-dom-vttcue-line-5">(4)</a>
+    <li><a href="#ref-for-dom-vttcue-line-1">3.3. WebVTT caption or subtitle cues</a>
+    <li><a href="#ref-for-dom-vttcue-line-2">9.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-line-3">(2)</a> <a href="#ref-for-dom-vttcue-line-4">(3)</a> <a href="#ref-for-dom-vttcue-line-5">(4)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttcue-linealign">
    <b><a href="#dom-vttcue-linealign">#dom-vttcue-linealign</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttcue-linealign-1">8.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-linealign-2">(2)</a> <a href="#ref-for-dom-vttcue-linealign-3">(3)</a>
+    <li><a href="#ref-for-dom-vttcue-linealign-1">9.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-linealign-2">(2)</a> <a href="#ref-for-dom-vttcue-linealign-3">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttcue-position">
    <b><a href="#dom-vttcue-position">#dom-vttcue-position</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttcue-position-1">8.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-position-2">(2)</a>
+    <li><a href="#ref-for-dom-vttcue-position-1">9.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-position-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttcue-positionalign">
    <b><a href="#dom-vttcue-positionalign">#dom-vttcue-positionalign</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttcue-positionalign-1">8.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-positionalign-2">(2)</a> <a href="#ref-for-dom-vttcue-positionalign-3">(3)</a>
+    <li><a href="#ref-for-dom-vttcue-positionalign-1">9.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-positionalign-2">(2)</a> <a href="#ref-for-dom-vttcue-positionalign-3">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttcue-size">
    <b><a href="#dom-vttcue-size">#dom-vttcue-size</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttcue-size-1">8.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-size-2">(2)</a>
+    <li><a href="#ref-for-dom-vttcue-size-1">9.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-size-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttcue-align">
    <b><a href="#dom-vttcue-align">#dom-vttcue-align</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttcue-align-1">8.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-align-2">(2)</a> <a href="#ref-for-dom-vttcue-align-3">(3)</a>
+    <li><a href="#ref-for-dom-vttcue-align-1">9.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-align-2">(2)</a> <a href="#ref-for-dom-vttcue-align-3">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttcue-text">
    <b><a href="#dom-vttcue-text">#dom-vttcue-text</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttcue-text-1">8.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-text-2">(2)</a>
+    <li><a href="#ref-for-dom-vttcue-text-1">9.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-text-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttcue-getcueashtml">
    <b><a href="#dom-vttcue-getcueashtml">#dom-vttcue-getcueashtml</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttcue-getcueashtml-1">5.5. WebVTT cue text DOM construction rules</a>
-    <li><a href="#ref-for-dom-vttcue-getcueashtml-2">8.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-getcueashtml-3">(2)</a> <a href="#ref-for-dom-vttcue-getcueashtml-4">(3)</a>
+    <li><a href="#ref-for-dom-vttcue-getcueashtml-1">6.5. WebVTT cue text DOM construction rules</a>
+    <li><a href="#ref-for-dom-vttcue-getcueashtml-2">9.1. The VTTCue interface</a> <a href="#ref-for-dom-vttcue-getcueashtml-3">(2)</a> <a href="#ref-for-dom-vttcue-getcueashtml-4">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="enumdef-scrollsetting">
    <b><a href="#enumdef-scrollsetting">#enumdef-scrollsetting</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-enumdef-scrollsetting-1">8.2. The VTTRegion interface</a>
+    <li><a href="#ref-for-enumdef-scrollsetting-1">9.2. The VTTRegion interface</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="vttregion">
    <b><a href="#vttregion">#vttregion</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-vttregion-1">8.1. The VTTCue interface</a> <a href="#ref-for-vttregion-2">(2)</a> <a href="#ref-for-vttregion-3">(3)</a>
-    <li><a href="#ref-for-vttregion-4">8.2. The VTTRegion interface</a> <a href="#ref-for-vttregion-5">(2)</a> <a href="#ref-for-vttregion-6">(3)</a> <a href="#ref-for-vttregion-7">(4)</a> <a href="#ref-for-vttregion-8">(5)</a> <a href="#ref-for-vttregion-9">(6)</a> <a href="#ref-for-vttregion-10">(7)</a> <a href="#ref-for-vttregion-11">(8)</a> <a href="#ref-for-vttregion-12">(9)</a> <a href="#ref-for-vttregion-13">(10)</a> <a href="#ref-for-vttregion-14">(11)</a>
+    <li><a href="#ref-for-vttregion-1">9.1. The VTTCue interface</a> <a href="#ref-for-vttregion-2">(2)</a> <a href="#ref-for-vttregion-3">(3)</a>
+    <li><a href="#ref-for-vttregion-4">9.2. The VTTRegion interface</a> <a href="#ref-for-vttregion-5">(2)</a> <a href="#ref-for-vttregion-6">(3)</a> <a href="#ref-for-vttregion-7">(4)</a> <a href="#ref-for-vttregion-8">(5)</a> <a href="#ref-for-vttregion-9">(6)</a> <a href="#ref-for-vttregion-10">(7)</a> <a href="#ref-for-vttregion-11">(8)</a> <a href="#ref-for-vttregion-12">(9)</a> <a href="#ref-for-vttregion-13">(10)</a> <a href="#ref-for-vttregion-14">(11)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttregion-vttregion">
    <b><a href="#dom-vttregion-vttregion">#dom-vttregion-vttregion</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttregion-vttregion-1">8.2. The VTTRegion interface</a> <a href="#ref-for-dom-vttregion-vttregion-2">(2)</a>
+    <li><a href="#ref-for-dom-vttregion-vttregion-1">9.2. The VTTRegion interface</a> <a href="#ref-for-dom-vttregion-vttregion-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttregion-id">
    <b><a href="#dom-vttregion-id">#dom-vttregion-id</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttregion-id-1">8.2. The VTTRegion interface</a> <a href="#ref-for-dom-vttregion-id-2">(2)</a>
+    <li><a href="#ref-for-dom-vttregion-id-1">9.2. The VTTRegion interface</a> <a href="#ref-for-dom-vttregion-id-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttregion-width">
    <b><a href="#dom-vttregion-width">#dom-vttregion-width</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttregion-width-1">8.2. The VTTRegion interface</a> <a href="#ref-for-dom-vttregion-width-2">(2)</a>
+    <li><a href="#ref-for-dom-vttregion-width-1">9.2. The VTTRegion interface</a> <a href="#ref-for-dom-vttregion-width-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttregion-lines">
    <b><a href="#dom-vttregion-lines">#dom-vttregion-lines</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttregion-lines-1">8.2. The VTTRegion interface</a> <a href="#ref-for-dom-vttregion-lines-2">(2)</a>
+    <li><a href="#ref-for-dom-vttregion-lines-1">9.2. The VTTRegion interface</a> <a href="#ref-for-dom-vttregion-lines-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttregion-regionanchorx">
    <b><a href="#dom-vttregion-regionanchorx">#dom-vttregion-regionanchorx</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttregion-regionanchorx-1">8.2. The VTTRegion interface</a> <a href="#ref-for-dom-vttregion-regionanchorx-2">(2)</a>
+    <li><a href="#ref-for-dom-vttregion-regionanchorx-1">9.2. The VTTRegion interface</a> <a href="#ref-for-dom-vttregion-regionanchorx-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttregion-regionanchory">
    <b><a href="#dom-vttregion-regionanchory">#dom-vttregion-regionanchory</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttregion-regionanchory-1">8.2. The VTTRegion interface</a> <a href="#ref-for-dom-vttregion-regionanchory-2">(2)</a>
+    <li><a href="#ref-for-dom-vttregion-regionanchory-1">9.2. The VTTRegion interface</a> <a href="#ref-for-dom-vttregion-regionanchory-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttregion-viewportanchorx">
    <b><a href="#dom-vttregion-viewportanchorx">#dom-vttregion-viewportanchorx</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttregion-viewportanchorx-1">8.2. The VTTRegion interface</a> <a href="#ref-for-dom-vttregion-viewportanchorx-2">(2)</a>
+    <li><a href="#ref-for-dom-vttregion-viewportanchorx-1">9.2. The VTTRegion interface</a> <a href="#ref-for-dom-vttregion-viewportanchorx-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttregion-viewportanchory">
    <b><a href="#dom-vttregion-viewportanchory">#dom-vttregion-viewportanchory</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttregion-viewportanchory-1">8.2. The VTTRegion interface</a> <a href="#ref-for-dom-vttregion-viewportanchory-2">(2)</a>
+    <li><a href="#ref-for-dom-vttregion-viewportanchory-1">9.2. The VTTRegion interface</a> <a href="#ref-for-dom-vttregion-viewportanchory-2">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-vttregion-scroll">
    <b><a href="#dom-vttregion-scroll">#dom-vttregion-scroll</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-vttregion-scroll-1">8.2. The VTTRegion interface</a> <a href="#ref-for-dom-vttregion-scroll-2">(2)</a> <a href="#ref-for-dom-vttregion-scroll-3">(3)</a>
+    <li><a href="#ref-for-dom-vttregion-scroll-1">9.2. The VTTRegion interface</a> <a href="#ref-for-dom-vttregion-scroll-2">(2)</a> <a href="#ref-for-dom-vttregion-scroll-3">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="text-vtt">
@@ -7640,7 +8012,3 @@
         });
         </script>
-        <p role="navigation" id="back-to-top"><a href="#toc"><abbr title="Back to top">↑</abbr></a></p>
- </body>
- </html>

WebVTT: The Web Video Text Tracks Format DIFF file

Diff between:

W3C Candidate Recommendation 15 April 2018

W3C Working Draft 08 August 2017

Prepared using diff2html by rtfpessoa