From 9301019689e88ab48742a4d1c32c6a094303040d Mon Sep 17 00:00:00 2001
From: Kyo Nagashima <hail2u@gmail.com>
Date: Fri, 27 Feb 2015 07:47:23 +0900
Subject: [PATCH] Update test case format

Small chunks of tests are easy to test highlighting.
---
 test/test.html | 1321 +++++++++++++++++++++++++-----------------------
 1 file changed, 684 insertions(+), 637 deletions(-)

diff --git a/test/test.html b/test/test.html
index 5fb3047..325192e 100644
--- a/test/test.html
+++ b/test/test.html
@@ -7,644 +7,691 @@
     <title>vim-css3-syntax</title>
 
     <link rel="stylesheet" href="http://hail2u.net/styles/natural.min.css">
-    <style>
-      .align {
-        justify-self: safe;
-        justify-content: true;
-        justify-items: self-start;
-        align-self: self-end;
-        align-content: flex-start;
-        align-items: flex-end;
-        display: space-around;
-        display: space-between;
-        display: space-evenly;
-      }
-
-      .animations {
-        animation: forwards;
-        animation-delay: backwards;
-        animation-direction: running;
-        animation-duration: paused;
-        animation-fill-mode: alternate-reverse;
-        animation-iteration-count: auto;
-        animation-name: auto;
-        animation-play-state: auto;
-        animation-timing-function: auto;
-      }
-
-      .background {
-        background-clip: space;
-        background-origin: round;
-        background-size: local;
-        border-image: fill;
-        border-image-source: stretch;
-        border-image-slice: clone;
-        border-image-width: slice;
-        border-image-outset: padding-box;
-        border-image-repeat: border-box;
-        border-radius: content-box;
-        border-top-right-radius: auto;
-        border-bottom-right-radius: auto;
-        border-bottom-left-radius: auto;
-        border-top-left-radius: auto;
-        box-shadow: auto;
-      }
-
-      .box {
-        overflow-style: scrollbar;
-        overflow-x: panner;
-        overflow-y: move;
-        rotation-point: marquee;
-        display: ruby;
-        display: ruby-base;
-        display: ruby-text;
-        display: ruby-base-group;
-        display: ruby-text-group;
-        display: no-display;
-        display: no-content;
-      }
-
-      .break {
-        break-after: any;
-        break-before: auto;
-        break-inside: auto;
-        box-decoration-break: auto;
-      }
-
-      .cascade {
-        all: unset;
-      }
-
-      .colors {
-        opacity: rgba(0, 0, 0, 1);
-        display: hsla(0, 0, 0, 1);
-        display: currentColor;
-      }
-
-      @supports (display: auto) or
-        (display: auto) not
-        (display: auto) {
-        .conditional {
-          display: auto;
-        }
-      }
-
-      .compositing {
-        mix-blend-mode: multiply;
-        isolation: screen;
-        background-blend-mode: overlay;
-        display: darken;
-        display: lighten;
-        display: color-dodge;
-        display: color-burn;
-        display: hard-light;
-        display: soft-light;
-        display: difference;
-        display: exclusion;
-        display: hue;
-        display: saturation;
-        display: color;
-        display: luminosity;
-      }
-
-      .content {
-        move-to: inhibit;
-        page-policy: here;
-        display: first;
-        display: last;
-      }
-
-      @counter-style counter-style {
-        system: cyclic;
-        negative: symbolic;
-        prefix: additive;
-        suffix: extends;
-        range: bullets;
-        pad: numbers;
-        fallback: words;
-        symbols: symbols("*" "\2020" "\2021" "\A7");
-        additive-symbols: auto;
-        speak-as: auto;
-      }
-
-      .counter-style {
-        display: arabic-indic;
-        display: upper-armenian;
-        display: lower-armenian;
-        display: bengali;
-        display: cambodian;
-        display: khmer;
-        display: cjk-decimal;
-        display: devanagari;
-        display: gujarati;
-        display: gurmukhi;
-        display: kannada;
-        display: lao;
-        display: malayalam;
-        display: mongolian;
-        display: myanmar;
-        display: oriya;
-        display: persian;
-        display: tamil;
-        display: telugu;
-        display: thai;
-        display: tibetan;
-        display: cjk-earthly-branch;
-        display: cjk-heavenly-stem;
-        display: disclosure-closed;
-        display: disclosure-open;
-        display: japanese-informal;
-        display: japanese-formal;
-        display: korean-hangul-formal;
-        display: korean-hanja-informal;
-        display: korean-hanja-formal;
-        display: simp-chinese-informal;
-        display: simp-chinese-formal;
-        display: trad-chinese-informal;
-        display: trad-chinese-formal;
-        display: ethiopic-numeric;
-      }
-
-      .display {
-        display-inside: block-level;
-        display-outside: inline-level;
-        display-list: contents;
-        display-suppress: inline-list-item;
-        display: show;
-      }
-
-      .exclusions {
-        wrap-flow: minimum;
-        wrap-through: maximum;
-      }
-
-      .flexbox {
-        flex-direction: flex;
-        flex-wrap: inline-flex;
-        flex-flow: row;
-        order: row-reverse;
-        flex: column-reverse;
-        flex-grow: wrap;
-        flex-shrink: wrap-reverse;
-        flex-basis: main-size;
-      }
-
-      .fonts {
-        font-feature-settings: common-ligatures;
-        font-kerning: no-common-ligatures;
-        font-language-override: discretionary-ligatures;
-        font-synthesis: no-discretionary-ligatures;
-        font-variant-alternates: historical-ligatures;
-        font-variant-caps: no-historical-ligatures;
-        font-variant-east-asian: contextual;
-        font-variant-ligatures: no-contextual;
-        font-variant-numeric: stylistic(feature-value-name);
-        font-variant-position: historical-forms;
-        display: styleset(feature-value-name #);
-        display: character-variant(feature-vlue-name #);
-        display: swash(feature-value-name);
-        display: ornaments(feature-value-name);
-        display: annotation(feature-value-name);
-        display: all-small-caps;
-        display: petite-caps;
-        display: all-petite-caps;
-        display: unicase;
-        display: titling-caps;
-        display: lining-nums;
-        display: oldstyle-nums;
-        display: proportional-nums;
-        display: tabular-nums;
-        display: diagonal-fractions;
-        display: stacked-fractions;
-        display: ordinal;
-        display: slashed-zero;
-        display: jis78;
-        display: jis83;
-        display: jis90;
-        display: jis04;
-        display: simplified;
-        display: traditional;
-        display: proportional-width;
-      }
-
-
-      .gcpm::footnote-call,
-      .gcpm::footnote-marker {
-        string-set: string(heading, first);
-        running: running(heading);
-        footnote-display: element(header);
-        footnote-policy: footnote;
-        bookmark-label: line;
-        bookmark-level: leader('.');
-        bookmark-state: target-counter(attr(href url), page);
-        display: target-counters(lack-of-example);
-        display: target-text(attr(href url));
-        display: open;
-        display: closed;
-      }
-
-      .grid-layout {
-        grid-template-columns: grid;
-        grid-template-rows: inline-grid;
-        grid-template-areas: minmax(0, 1);
-        grid-template: repeat(4);
-        grid-auto-columns: 0.2fr;
-        grid-auto-rows: subgrid;
-        grid-auto-flow: rows;
-        grid-auto-position: columns;
-        grid: dense;
-        grid-row-start: span;
-        grid-column-start: auto;
-        grid-row-end: auto;
-        grid-column-end: auto;
-        grid-column: auto;
-        grid-row: auto;
-        grid-area: auto;
-      }
-
-      .images {
-        object-fit: contain;
-        object-position: cover;
-        image-resolution: snap;
-        image-orientation: scale-down;
-        display: from-image;
-        display: image("sprite.svg#xywh=40,0,20,20");
-        display: linear-gradient(to bottom, yellow, blue);
-        display: radial-gradient(farthest-corner at 50% 50%, yellow, green);
-        display: repeating-linear-gradient(to bottom, yellow, blue);
-        display: repeating-radial-gradient(farthest-corner at 50% 50%, yellow, green);
-      }
-
-      .inline {
-        initial-letter: ideographic;
-        initial-letter-align: auto;
-      }
-
-      .layout::slot(b) {
-        display: same;
-      }
-
-      .line-grid {
-        line-grid: create;
-        line-snap: block-start;
-        box-snap: block-end;
-        display: first-baseline;
-        display: last-baseline;
-      }
-
-      .linebox {
-        alignment-adjust: central;
-        alignment-baseline: mathematical;
-        baseline-shift: before-edge;
-        dominate-baseline: after-edge;
-        drop-initial-after-adjust: text-before-edge;
-        drop-initial-after-align: text-after-edge;
-        drop-initial-before-adjust: use-script;
-        drop-initial-before-align: caps-height;
-        drop-initial-size: exclude-ruby;
-        drop-initial-value: include-ruby;
-        inline-box-align: consider-shift;
-        line-stacking: disregard-shift;
-        line-stacking-ruby: inline-line-height;
-        line-stacking-shift: block-line-height;
-        line-stacking-strategy: max-height;
-        text-height: grid-height;
-        display: font-size;
-        display: text-size;
-        display: max-size;
-      }
-
-      .lists::marker {
-        display: auto;
-      }
-
-      .masking {
-        clip-path: fill-box;
-        clip-rule: stroke-box;
-        mask-image: view-box;
-        mask-mode: nonzero;
-        mask-repeat: evenodd;
-        mask-position: alpha;
-        mask-clip: luminance;
-        mask-origin: no-clip;
-        mask-size: add;
-        mask-composite: subtract;
-        mask: intersect;
-        mask-border-source: exclude;
-        mask-border-mode: auto;
-        mask-border-slice: auto;
-        mask-border-width: auto;
-        mask-border-outset: auto;
-        mask-border-repeat: auto;
-        mask-border: auto;
-        mask-type: auto;
-      }
-
-      .multicol {
-        columns: column;
-        column-count: balance;
-        column-fill: avoid-column;
-        column-gap: auto;
-        column-rule: auto;
-        column-rule-color: auto;
-        column-rule-style: auto;
-        column-rule-width: auto;
-        column-span: auto;
-        column-width: auto;
-      }
-
-      .overflow {
-        max-lines: paged-x;
-        display: paged-y;
-        display: paged-x-controls;
-        display: paged-y-controls;
-        display: fragments;
-      }
-
-      .page {
-        display: avoid-page;
-        display: page;
-        display: recto;
-        display: verso;
-      }
-
-      .positioning {
-        offset-before: sticky;
-        offset-end: auto;
-        offset-after: auto;
-        offset-start: auto;
-      }
-
-      .pseudo::selection,
-      .pseudo::spelling-error,
-      .pseudo::grammer-error,
-      .pseuod::placeholder {
-        display: block;
-      }
-
-      .regions:region {
-        flow-into: element;
-        flow-from: content;
-        region-fragment: break;
-        display: region;
-        display: avoid-region;
-      }
-
-      .ruby {
-        ruby-position: ruby-base-container;
-        ruby-merge: ruby-text-container;
-        ruby-align: inter-character;
-      }
-
-      @scope .scoping {
-        div {
-          display: auto;
-        }
-      }
-
-      .scoping:scope-context div,
-      .scoping:host,
-      .scping:host(.foo),
-      .scoping:host-context,
-      .scoping::shadow,
-      .scoping::content,
-      .scoping /deep/ span {
-        display: auto;
-      }
-
-      .selectors3:target,
-      .selectors3:enabled,
-      .selectors3:disabled,
-      .selectors3:checked,
-      .selectors3:indeterminate,
-      .selectors3:root,
-      .selectors3:empty,
-      .selectors3:last-child,
-      .selectors3:last-of-type,
-      .selectors3:first-of-type,
-      .selectors3:only-child,
-      .selectors3:only-of-type,
-      .selectors3:nth-child(2n+1),
-      .selectors3:nth-last-child(-n+2),
-      .selectors3:nth-of-type(2n+1),
-      .selectors3:nth-last-of-type(n+2),
-      .selectors3:not([DISABLED]) {
-        display: auto;
-      }
-
-      .selectors4 | h1,
-      .selectors4:scope,
-      .selectors4:current,
-      .selectors4:past,
-      .selectors4:future,
-      .selectors4:default,
-      .selectors4:valid,
-      .selectors4:invalid,
-      .selectors4:required,
-      .selectors4:optional,
-      .selectors4:blank,
-      .selectors4:any-link,
-      .selectors4:local-link,
-      .selectors4:read-only,
-      .selectors4:read-write,
-      .selectors4:placeholder-shown,
-      .selectors4:in-range,
-      .selectors4:out-of-range,
-      .selectors4:user-error,
-      .selectors4:active-drop-target,
-      .selectors4:valid-drop-target,
-      .selectors4:invalid-drop-target,
-      .selectors3:matches(:hover, :focus),
-      .selectors4:dir(ltr),
-      .selectors4:local-link(0),
-      .selectors4:current(p, li, dt, dd),
-      .selectors4:nth-match(2n+1),
-      .selectors4:nth-last-match(-n+2),
-      .selectors4:nth-column(2n+1),
-      .selectors4:nth-last-column(-n+2),
-      .selectors4:column(p, li, dt, dd) {
-        display: auto;
-      }
-
-      .shapes {
-        shape-outside: margin-box;
-        shape-image-threshold: inset(50% 50% 50% 50%);
-        shape-margin: circle(100px 50px 100px);
-        display: ellipse(0 0 250px 100px);
-        display: polygon(0 0, 100% 100%, 0 100%);
-      }
-
-      .sizing {
-        display: max-content;
-        display: fit-content;
-        display: fill-available;
-        display: repudiate-floats;
-        display: contain-floats;
-      }
-
-      .speech {
-        voice-volume: 10dB;
-        voice-balance: literal-punctuation;
-        rest-before: no-punctuation;
-        rest-after: x-weak;
-        rest: weak;
-        voice-rate: strong;
-        voice-pitch: x-strong;
-        voice-range: young;
-        voice-stress: old;
-        voice-duration: neutral;
-        display: preserve;
-        display: 10st;
-        display: moderate;
-        display: reduced;
-      }
-
-      .text {
-        hyphens: manual;
-        line-break: loose;
-        overflow-wrap: strict;
-        tab-size: match-parent;
-        display: hanging;
-        display: each-line;
-        display: full-width;
-      }
-
-      .text-decor-3 {
-        text-decoration-color: filled;
-        text-decoration-line: dot;
-        text-decoration-skip: triangle;
-        text-decoration-style: sesame;
-        text-emphasis: objects;
-        text-emphasis-color: ink;
-        text-emphasis-position: edges;
-        text-emphasis-style: wavy;
-        display: alphabetic;
-        display: spaces;
-        display: box-decoration;
-        display: under;
-        display: over;
-      }
-
-      .transforms {
-        backface-visibility: flat;
-        perspective: preserve-3d;
-        perspective-origin: matrix(1);
-        transform: matrix3d(1);
-        transform-origin: translate(1);
-        transform-style: translate3d(1);
-        display: translateX(1);
-        display: translateY(1);
-        display: translateZ(1);
-        display: scale(1);
-        display: scale3d(1);
-        display: scaleX(1);
-        display: scaleY(1);
-        display: scaleZ(1);
-        display: rotate(1);
-        display: rotate3d(1);
-        display: rotateX(1);
-        display: rotateY(1);
-        display: rotateZ(1);
-        display: skew(1);
-        display: skewX(1);
-        display: skewY(1);
-        display: perspective(1);
-      }
-
-      .transitions {
-        transition: linear;
-        transition-property: ease;
-        transition-duration: ease-in;
-        transition-timing-function: ease-out;
-        transition-delay: ease-in-out;
-        display: step-start;
-        display: step-end;
-        display: steps(1, start);
-        display: cubic-bezier(0.25, 0.1, 0.25, 1.0);
-      }
-
-      .ui::value,
-      .ui::choices {
-        caret-color: grab;
-        display: grabbing;
-      }
-
-      .values {
-        display: 1ch;
-        display: 1rem;
-        display: 1vw;
-        display: 1vh;
-        display: 1vmin;
-        display: 1turn;
-        display: 1dpi;
-        display: 1dpcm;
-        display: 1dppx;
-        display: calc(100%/3 - 2*1em - 2*1px);
-        display: toggle(italic, normal);
-        display: initial;
-      }
-
-      .variables {
-        var-foo: var(foo);
-      }
-
-      .will-change {
-        will-change: scroll-position;
-      }
-
-      .writing-modes {
-        text-orientation: before;
-        text-combine-horizontal: after;
-        writing-mode: isolate;
-        display: isolate;
-        display: plaintext;
-        display: mixed;
-        display: upright;
-        display: sideways;
-        display: sideways-right;
-        display: sideways-left;
-        display: use-glyph-orientation;
-        display: horizontal-tb;
-        display: vertical-rl;
-        display: vertical-lr;
-      }
-
-      .html5-elements,
-      article,
-      section,
-      nav,
-      aside,
-      header,
-      footer,
-      figure,
-      figcaption,
-      main,
-      data,
-      time,
-      mark,
-      ruby,
-      rb,
-      rt,
-      rtc,
-      rp,
-      bdi,
-      wbr,
-      embed,
-      video,
-      audio,
-      source,
-      track,
-      datalist,
-      keygen,
-      output,
-      progress,
-      meter,
-      template,
-      canvas {
-        display: auto;
-      }
-    </style>
+<style>
+.align {
+  justify-self: safe;
+  justify-content: true;
+  justify-items: self-start;
+  align-self: self-end;
+  align-content: flex-start;
+  align-items: flex-end;
+  display: space-around;
+  display: space-between;
+  display: space-evenly;
+}
+</style>
+<style>
+.animations {
+  animation: forwards;
+  animation-delay: backwards;
+  animation-direction: running;
+  animation-duration: paused;
+  animation-fill-mode: alternate-reverse;
+  animation-iteration-count: auto;
+  animation-name: auto;
+  animation-play-state: auto;
+  animation-timing-function: auto;
+}
+</style>
+<style>
+.background {
+  background-clip: space;
+  background-origin: round;
+  background-size: local;
+  border-image: fill;
+  border-image-source: stretch;
+  border-image-slice: clone;
+  border-image-width: slice;
+  border-image-outset: padding-box;
+  border-image-repeat: border-box;
+  border-radius: content-box;
+  border-top-right-radius: auto;
+  border-bottom-right-radius: auto;
+  border-bottom-left-radius: auto;
+  border-top-left-radius: auto;
+  box-shadow: auto;
+}
+</style>
+<style>
+.box {
+  overflow-style: scrollbar;
+  overflow-x: panner;
+  overflow-y: move;
+  rotation-point: marquee;
+  display: ruby;
+  display: ruby-base;
+  display: ruby-text;
+  display: ruby-base-group;
+  display: ruby-text-group;
+  display: no-display;
+  display: no-content;
+}
+</style>
+<style>
+.break {
+  break-after: any;
+  break-before: auto;
+  break-inside: auto;
+  box-decoration-break: auto;
+}
+</style>
+<style>
+.cascade {
+  all: unset;
+}
+</style>
+<style>
+.colors {
+  opacity: rgba(0, 0, 0, 1);
+  display: hsla(0, 0, 0, 1);
+  display: currentColor;
+}
+</style>
+<style>
+@supports (display: auto) or
+  (display: auto) not
+  (display: auto) {
+  .conditional {
+    display: auto;
+  }
+}
+</style>
+<style>
+.compositing {
+  mix-blend-mode: multiply;
+  isolation: screen;
+  background-blend-mode: overlay;
+  display: darken;
+  display: lighten;
+  display: color-dodge;
+  display: color-burn;
+  display: hard-light;
+  display: soft-light;
+  display: difference;
+  display: exclusion;
+  display: hue;
+  display: saturation;
+  display: color;
+  display: luminosity;
+}
+</style>
+<style>
+.content {
+  move-to: inhibit;
+  page-policy: here;
+  display: first;
+  display: last;
+}
+</style>
+<style>
+@counter-style counter-style {
+  system: cyclic;
+  negative: symbolic;
+  prefix: additive;
+  suffix: extends;
+  range: bullets;
+  pad: numbers;
+  fallback: words;
+  symbols: symbols("*" "\2020" "\2021" "\A7");
+  additive-symbols: auto;
+  speak-as: auto;
+}
+</style>
+<style>
+.counter-style {
+  display: arabic-indic;
+  display: upper-armenian;
+  display: lower-armenian;
+  display: bengali;
+  display: cambodian;
+  display: khmer;
+  display: cjk-decimal;
+  display: devanagari;
+  display: gujarati;
+  display: gurmukhi;
+  display: kannada;
+  display: lao;
+  display: malayalam;
+  display: mongolian;
+  display: myanmar;
+  display: oriya;
+  display: persian;
+  display: tamil;
+  display: telugu;
+  display: thai;
+  display: tibetan;
+  display: cjk-earthly-branch;
+  display: cjk-heavenly-stem;
+  display: disclosure-closed;
+  display: disclosure-open;
+  display: japanese-informal;
+  display: japanese-formal;
+  display: korean-hangul-formal;
+  display: korean-hanja-informal;
+  display: korean-hanja-formal;
+  display: simp-chinese-informal;
+  display: simp-chinese-formal;
+  display: trad-chinese-informal;
+  display: trad-chinese-formal;
+  display: ethiopic-numeric;
+}
+</style>
+<style>
+.display {
+  display-inside: block-level;
+  display-outside: inline-level;
+  display-list: contents;
+  display-suppress: inline-list-item;
+  display: show;
+}
+</style>
+<style>
+.exclusions {
+  wrap-flow: minimum;
+  wrap-through: maximum;
+}
+</style>
+<style>
+.flexbox {
+  flex-direction: flex;
+  flex-wrap: inline-flex;
+  flex-flow: row;
+  order: row-reverse;
+  flex: column-reverse;
+  flex-grow: wrap;
+  flex-shrink: wrap-reverse;
+  flex-basis: main-size;
+}
+</style>
+<style>
+.fonts {
+  font-feature-settings: common-ligatures;
+  font-kerning: no-common-ligatures;
+  font-language-override: discretionary-ligatures;
+  font-synthesis: no-discretionary-ligatures;
+  font-variant-alternates: historical-ligatures;
+  font-variant-caps: no-historical-ligatures;
+  font-variant-east-asian: contextual;
+  font-variant-ligatures: no-contextual;
+  font-variant-numeric: stylistic(feature-value-name);
+  font-variant-position: historical-forms;
+  display: styleset(feature-value-name #);
+  display: character-variant(feature-vlue-name #);
+  display: swash(feature-value-name);
+  display: ornaments(feature-value-name);
+  display: annotation(feature-value-name);
+  display: all-small-caps;
+  display: petite-caps;
+  display: all-petite-caps;
+  display: unicase;
+  display: titling-caps;
+  display: lining-nums;
+  display: oldstyle-nums;
+  display: proportional-nums;
+  display: tabular-nums;
+  display: diagonal-fractions;
+  display: stacked-fractions;
+  display: ordinal;
+  display: slashed-zero;
+  display: jis78;
+  display: jis83;
+  display: jis90;
+  display: jis04;
+  display: simplified;
+  display: traditional;
+  display: proportional-width;
+}
+</style>
+<style>
 
+.gcpm::footnote-call,
+.gcpm::footnote-marker {
+  string-set: string(heading, first);
+  running: running(heading);
+  footnote-display: element(header);
+  footnote-policy: footnote;
+  bookmark-label: line;
+  bookmark-level: leader('.');
+  bookmark-state: target-counter(attr(href url), page);
+  display: target-counters(lack-of-example);
+  display: target-text(attr(href url));
+  display: open;
+  display: closed;
+}
+</style>
+<style>
+.grid-layout {
+  grid-template-columns: grid;
+  grid-template-rows: inline-grid;
+  grid-template-areas: minmax(0, 1);
+  grid-template: repeat(4);
+  grid-auto-columns: 0.2fr;
+  grid-auto-rows: subgrid;
+  grid-auto-flow: rows;
+  grid-auto-position: columns;
+  grid: dense;
+  grid-row-start: span;
+  grid-column-start: auto;
+  grid-row-end: auto;
+  grid-column-end: auto;
+  grid-column: auto;
+  grid-row: auto;
+  grid-area: auto;
+}
+</style>
+<style>
+.images {
+  object-fit: contain;
+  object-position: cover;
+  image-resolution: snap;
+  image-orientation: scale-down;
+  display: from-image;
+  display: image("sprite.svg#xywh=40,0,20,20");
+  display: linear-gradient(to bottom, yellow, blue);
+  display: radial-gradient(farthest-corner at 50% 50%, yellow, green);
+  display: repeating-linear-gradient(to bottom, yellow, blue);
+  display: repeating-radial-gradient(farthest-corner at 50% 50%, yellow, green);
+}
+</style>
+<style>
+.inline {
+  initial-letter: ideographic;
+  initial-letter-align: auto;
+}
+</style>
+<style>
+.layout::slot(b) {
+  display: same;
+}
+</style>
+<style>
+.line-grid {
+  line-grid: create;
+  line-snap: block-start;
+  box-snap: block-end;
+  display: first-baseline;
+  display: last-baseline;
+}
+</style>
+<style>
+.linebox {
+  alignment-adjust: central;
+  alignment-baseline: mathematical;
+  baseline-shift: before-edge;
+  dominate-baseline: after-edge;
+  drop-initial-after-adjust: text-before-edge;
+  drop-initial-after-align: text-after-edge;
+  drop-initial-before-adjust: use-script;
+  drop-initial-before-align: caps-height;
+  drop-initial-size: exclude-ruby;
+  drop-initial-value: include-ruby;
+  inline-box-align: consider-shift;
+  line-stacking: disregard-shift;
+  line-stacking-ruby: inline-line-height;
+  line-stacking-shift: block-line-height;
+  line-stacking-strategy: max-height;
+  text-height: grid-height;
+  display: font-size;
+  display: text-size;
+  display: max-size;
+}
+</style>
+<style>
+.lists::marker {
+  display: auto;
+}
+</style>
+<style>
+.masking {
+  clip-path: fill-box;
+  clip-rule: stroke-box;
+  mask-image: view-box;
+  mask-mode: nonzero;
+  mask-repeat: evenodd;
+  mask-position: alpha;
+  mask-clip: luminance;
+  mask-origin: no-clip;
+  mask-size: add;
+  mask-composite: subtract;
+  mask: intersect;
+  mask-border-source: exclude;
+  mask-border-mode: auto;
+  mask-border-slice: auto;
+  mask-border-width: auto;
+  mask-border-outset: auto;
+  mask-border-repeat: auto;
+  mask-border: auto;
+  mask-type: auto;
+}
+</style>
+<style>
+.multicol {
+  columns: column;
+  column-count: balance;
+  column-fill: avoid-column;
+  column-gap: auto;
+  column-rule: auto;
+  column-rule-color: auto;
+  column-rule-style: auto;
+  column-rule-width: auto;
+  column-span: auto;
+  column-width: auto;
+}
+</style>
+<style>
+.overflow {
+  max-lines: paged-x;
+  display: paged-y;
+  display: paged-x-controls;
+  display: paged-y-controls;
+  display: fragments;
+}
+</style>
+<style>
+.page {
+  display: avoid-page;
+  display: page;
+  display: recto;
+  display: verso;
+}
+</style>
+<style>
+.positioning {
+  offset-before: sticky;
+  offset-end: auto;
+  offset-after: auto;
+  offset-start: auto;
+}
+</style>
+<style>
+.pseudo::selection,
+.pseudo::spelling-error,
+.pseudo::grammer-error,
+.pseuod::placeholder {
+  display: block;
+}
+</style>
+<style>
+.regions:region {
+  flow-into: element;
+  flow-from: content;
+  region-fragment: break;
+  display: region;
+  display: avoid-region;
+}
+</style>
+<style>
+.ruby {
+  ruby-position: ruby-base-container;
+  ruby-merge: ruby-text-container;
+  ruby-align: inter-character;
+}
+</style>
+<style>
+@scope .scoping {
+  div {
+    display: auto;
+  }
+}
+</style>
+<style>
+.scoping:scope-context div,
+.scoping:host,
+.scping:host(.foo),
+.scoping:host-context,
+.scoping::shadow,
+.scoping::content,
+.scoping /deep/ span {
+  display: auto;
+}
+</style>
+<style>
+.selectors3:target,
+.selectors3:enabled,
+.selectors3:disabled,
+.selectors3:checked,
+.selectors3:indeterminate,
+.selectors3:root,
+.selectors3:empty,
+.selectors3:last-child,
+.selectors3:last-of-type,
+.selectors3:first-of-type,
+.selectors3:only-child,
+.selectors3:only-of-type,
+.selectors3:nth-child(2n+1),
+.selectors3:nth-last-child(-n+2),
+.selectors3:nth-of-type(2n+1),
+.selectors3:nth-last-of-type(n+2),
+.selectors3:not([DISABLED]) {
+  display: auto;
+}
+</style>
+<style>
+.selectors4 | h1,
+.selectors4:scope,
+.selectors4:current,
+.selectors4:past,
+.selectors4:future,
+.selectors4:default,
+.selectors4:valid,
+.selectors4:invalid,
+.selectors4:required,
+.selectors4:optional,
+.selectors4:blank,
+.selectors4:any-link,
+.selectors4:local-link,
+.selectors4:read-only,
+.selectors4:read-write,
+.selectors4:placeholder-shown,
+.selectors4:in-range,
+.selectors4:out-of-range,
+.selectors4:user-error,
+.selectors4:active-drop-target,
+.selectors4:valid-drop-target,
+.selectors4:invalid-drop-target,
+.selectors3:matches(:hover, :focus),
+.selectors4:dir(ltr),
+.selectors4:local-link(0),
+.selectors4:current(p, li, dt, dd),
+.selectors4:nth-match(2n+1),
+.selectors4:nth-last-match(-n+2),
+.selectors4:nth-column(2n+1),
+.selectors4:nth-last-column(-n+2),
+.selectors4:column(p, li, dt, dd) {
+  display: auto;
+}
+</style>
+<style>
+.shapes {
+  shape-outside: margin-box;
+  shape-image-threshold: inset(50% 50% 50% 50%);
+  shape-margin: circle(100px 50px 100px);
+  display: ellipse(0 0 250px 100px);
+  display: polygon(0 0, 100% 100%, 0 100%);
+}
+</style>
+<style>
+.sizing {
+  display: max-content;
+  display: fit-content;
+  display: fill-available;
+  display: repudiate-floats;
+  display: contain-floats;
+}
+</style>
+<style>
+.speech {
+  voice-volume: 10dB;
+  voice-balance: literal-punctuation;
+  rest-before: no-punctuation;
+  rest-after: x-weak;
+  rest: weak;
+  voice-rate: strong;
+  voice-pitch: x-strong;
+  voice-range: young;
+  voice-stress: old;
+  voice-duration: neutral;
+  display: preserve;
+  display: 10st;
+  display: moderate;
+  display: reduced;
+}
+</style>
+<style>
+.text {
+  hyphens: manual;
+  line-break: loose;
+  overflow-wrap: strict;
+  tab-size: match-parent;
+  display: hanging;
+  display: each-line;
+  display: full-width;
+}
+</style>
+<style>
+.text-decor-3 {
+  text-decoration-color: filled;
+  text-decoration-line: dot;
+  text-decoration-skip: triangle;
+  text-decoration-style: sesame;
+  text-emphasis: objects;
+  text-emphasis-color: ink;
+  text-emphasis-position: edges;
+  text-emphasis-style: wavy;
+  display: alphabetic;
+  display: spaces;
+  display: box-decoration;
+  display: under;
+  display: over;
+}
+</style>
+<style>
+.transforms {
+  backface-visibility: flat;
+  perspective: preserve-3d;
+  perspective-origin: matrix(1);
+  transform: matrix3d(1);
+  transform-origin: translate(1);
+  transform-style: translate3d(1);
+  display: translateX(1);
+  display: translateY(1);
+  display: translateZ(1);
+  display: scale(1);
+  display: scale3d(1);
+  display: scaleX(1);
+  display: scaleY(1);
+  display: scaleZ(1);
+  display: rotate(1);
+  display: rotate3d(1);
+  display: rotateX(1);
+  display: rotateY(1);
+  display: rotateZ(1);
+  display: skew(1);
+  display: skewX(1);
+  display: skewY(1);
+  display: perspective(1);
+}
+</style>
+<style>
+.transitions {
+  transition: linear;
+  transition-property: ease;
+  transition-duration: ease-in;
+  transition-timing-function: ease-out;
+  transition-delay: ease-in-out;
+  display: step-start;
+  display: step-end;
+  display: steps(1, start);
+  display: cubic-bezier(0.25, 0.1, 0.25, 1.0);
+}
+</style>
+<style>
+.ui::value,
+.ui::choices {
+  caret-color: grab;
+  display: grabbing;
+}
+</style>
+<style>
+.values {
+  display: 1ch;
+  display: 1rem;
+  display: 1vw;
+  display: 1vh;
+  display: 1vmin;
+  display: 1turn;
+  display: 1dpi;
+  display: 1dpcm;
+  display: 1dppx;
+  display: calc(100%/3 - 2*1em - 2*1px);
+  display: toggle(italic, normal);
+  display: initial;
+}
+</style>
+<style>
+.variables {
+  var-foo: var(foo);
+}
+</style>
+<style>
+.will-change {
+  will-change: scroll-position;
+}
+</style>
+<style>
+.writing-modes {
+  text-orientation: before;
+  text-combine-horizontal: after;
+  writing-mode: isolate;
+  display: isolate;
+  display: plaintext;
+  display: mixed;
+  display: upright;
+  display: sideways;
+  display: sideways-right;
+  display: sideways-left;
+  display: use-glyph-orientation;
+  display: horizontal-tb;
+  display: vertical-rl;
+  display: vertical-lr;
+}
+</style>
+<style>
+.html5-elements,
+article,
+section,
+nav,
+aside,
+header,
+footer,
+figure,
+figcaption,
+main,
+data,
+time,
+mark,
+ruby,
+rb,
+rt,
+rtc,
+rp,
+bdi,
+wbr,
+embed,
+video,
+audio,
+source,
+track,
+datalist,
+keygen,
+output,
+progress,
+meter,
+template,
+canvas {
+  display: auto;
+}
+</style>
     <!--[if lt IE 9]><script src="http://hail2u.net/scripts/html5shiv.min.js"></script><![endif]-->
   </head>
   <body>