Add css-round-display-1.vim

See also: http://www.w3.org/TR/2015/WD-css-round-display-1-20150922/

README.md

@@ -68,13 +68,13 @@ cyan and bold (on gVim).
 ### CSS Preprocessors: [Sass][2], [LESS][3], and [Stylus][4]
 
 `vim-css3-syntax` supports Sass's SCSS syntax only. If you want to use this
-plugin with LESS, install [VIM-LESS][5]. Sass's indent synatx and Stylus are not
+plugin with LESS, install [VIM-LESS][5]. Sass's indent syntax and Stylus are not
 supported.
 
 
 ### Media Queries
 
-I drop Media Queries Level 3 support in v0.12.0. There is no easy way to supprt
+I drop Media Queries Level 3 support in v0.12.0. There is no easy way to support
 Media Queries properly with `after` syntax plugin like this one, sorry. If you
 want to highlight Media Queries correctly, you must update Vim to 7.4+ or
 install [JulesWang/css.vim][6].
@@ -83,7 +83,7 @@ install [JulesWang/css.vim][6].
 AUTHOR
 ------
 
-Kyo Namegashima <kyo@hail2u.net>
+Kyo Nagashima <hail2u@gmail.com> (https://kyonagashima.com/)
 
 
 LICENSE

after/syntax/css/css-cascade-3.vim

@@ -0,0 +1,2 @@
+syn keyword cssFontProp all
+syn keyword cssCommonAttr contained initial unset

after/syntax/css/css-cascade-4.vim

@@ -0,0 +1,2 @@
+syn keyword cssCommonAttr contained revert
+syn region cssURL contained matchgroup=cssFunctionName start="\<supports\s*(" end=")" oneline keepend

after/syntax/css/css-counter-styles-3.vim

@@ -1,9 +1,14 @@
-" TODO: create cssCounterStyleDescriptor for `@counter-style` descriptor
+" TODO: create cssCounterStyleDescriptor for `@counter-style` descriptors
-syn keyword cssGeneratedContentProp contained negative prefix suffix range pad fallback
+syn region cssInclude start=/@counter-style\>/ end=/\ze{/ skipwhite skipnl contains=css.*Prop,css.*Attr,cssValueInteger,cssValueLength,cssMediaKeyword,cssVendor,cssIncludeKeyword,cssComment nextgroup=cssMediaBlock
+syn keyword cssGeneratedContentProp contained system negative prefix suffix range pad fallback
 syn match cssGeneratedContentProp contained "\<\(additive-\)\=symbols\>"
 syn match cssGeneratedContentProp contained "\<speak-as\>"
+syn keyword cssGeneratedContentAttr contained cyclic symbolic additive extends bullets numbers words bengali cambodian khmer devanagari gujarati gurmukhi kannada lao malayalam mongolian myanmar oriya persian tamil telugu thai tibetan
+syn match cssGeneratedContentAttr contained "\<\(ethiopic-\)\=numeric\>"
+syn match cssGeneratedContentAttr contained "\<arabic-indic\>"
+syn match cssGeneratedContentAttr contained "\<\(upper\|lower\)-armenian\>"
+syn match cssGeneratedContentAttr contained "\<cjk-\(decimal\|earthly-branch\|heavenly-stem\)\>"
 syn match cssGeneratedContentAttr contained "\<disclosure-\(open\|closed\)\>"
-syn match cssGeneratedContentAttr contained "\<simp-chinese-\(in\)\=formal\>"
+syn match cssGeneratedContentAttr contained "\<\(japanese\|korean-hanja\|\(simp\|trad\)-chinese\)-\(in\)\=formal\>"
-syn match cssGeneratedContentAttr contained "\<trad-chinese-\(in\)\=formal\>"
+syn match cssGeneratedContentAttr contained "\<korean-hangul-formal\>"
-syn match cssGeneratedContentAttr contained "\<ethiopic-numeric\>"
 syn region cssFunction contained matchgroup=cssFunctionName start="\<symbols\s*(" end=")" oneline keepend

after/syntax/css/css-display-3.vim

@@ -1,5 +1,5 @@
 " TODO: create cssDisplayProp group and cssDisplayAttr group
-syn match cssFontProp contained "\<display-\(inside\|outside\|extras\|box\)\>"
+syn match cssFontProp contained "\<box-suppress\>"
-syn keyword cssFontAttr contained contents
+syn keyword cssFontAttr contained contents discard
-syn match cssFontAttr contained "\<\(block\|inline\)-level\>"
+syn match cssFontAttr contained "\<flow\(-root\)\=\>"
 syn match cssFontAttr contained "\<inline-list-item\>"

after/syntax/css/css-flexbox-1.vim

@@ -4,3 +4,4 @@ syn match cssFontProp contained "\<flex\(-\(basis\|direction\|flow\|grow\|shrink
 syn keyword cssFontAttr contained flex row wrap
 syn match cssFontAttr contained "\<inline-flex\>"
 syn match cssFontAttr contained "\<\(row\|column\|wrap\)-reverse\>"
+syn match cssFontAttr contained "\<main-size\>"

after/syntax/css/css-grid-1.vim

@@ -2,7 +2,8 @@ syn match cssFontProp contained "\<grid-template\(-\(columns\|rows\|areas\)\)\=\
 syn match cssFontProp contained "\<grid-auto-\(columns\|rows\|flow\|position\)\>"
 syn match cssFontProp contained "\<grid-\(row\|column\)\(-\(start\|end\)\)\=\>"
 syn match cssFontProp contained "\<grid-area\>"
-syn keyword cssFontAttr contained grid subgrid rows columns dense span
+syn match cssFontProp contained "\<grid\(-\(column\|row\)\)\=-gap\>"
+syn keyword cssFontAttr contained grid subgrid dense span
 syn match cssFontAttr contained "\<inline-grid\>"
 syn match cssValueNumber contained "[01]\(.\d\+\)\=fr"
 syn region cssFunction contained matchgroup=cssFunctionName start="\<\(minmax\|repeat\)\s*(" end=")" oneline keepend

after/syntax/css/css-inline-3.vim

@@ -0,0 +1,4 @@
+syn match cssFontProp contained "\<\(dominant\|alignment\)-baseline\>"
+syn match cssFontProp contained "\<baseline-shift\>"
+syn match cssFontProp contained "\<initial-letter\(-\(align\|wrap\)\)\="
+syn keyword cssFontAttr contained mathematical ideographic

after/syntax/css/css-line-grid-1.vim

@@ -1,7 +1,6 @@
 " TODO: create cssLineGridProp and cssLineGridAttr
-syn match cssFontProp contained "\<line-\(grid\|snap\|slack\)"
+syn match cssFontProp contained "\<line-\(grid\|snap\)"
 syn match cssFontProp contained "\<box-snap\>"
-syn match cssFontAttr contained "\<half-border\>"
 syn keyword cssFontAttr contained create
-syn match cssValueNumber contained "\d\+gd"
+syn match cssFontAttr contained "\<block-\(start\|end\)\>"
-syn region cssFunction contained matchgroup=cssFunctionName start="\<round\(down\|up\)\s*(" end=")" oneline keepend
+syn match cssFontAttr contained "\<\(first\|last\)-baseline\>"

after/syntax/css/css-page-floats-3.vim

@@ -0,0 +1,4 @@
+syn match cssPositioningProp contained "\<float-\(reference\|defer\|offset\)\>"
+syn match cssPositioningAttr contained "\<inline-\(start\|end\)\>"
+syn match cssPositioningAttr contained "\<snap-\(block\|inline\)\>"
+syn region cssURL contained matchgroup=cssFunctionName start="\<snap-\(block\|inline\)\s*(" end=")" oneline keepend

after/syntax/css/css-pseudo-4.vim

@@ -0,0 +1 @@
+syn match cssPseudoClassId contained "\<\(spelling\|grammer\)-error\>"

after/syntax/css/css-round-display-1.vim

@@ -0,0 +1,7 @@
+syn match cssFontProp contained "\<shape-inside\>"
+syn match cssFontProp contained "\<border-boundary\>"
+syn match cssFontProp contained "\<polar-\(angle\|distance\)\>"
+syn keyword cssFontAttr contained parent polar
+syn match cssFontAttr contained "\<outside-shape\>"
+syn match cssFontAttr contained "\<shape-box\>"
+syn match cssMediaProp contained /device-radius/

after/syntax/css/css-snappoints-1.vim

@@ -0,0 +1,2 @@
+syn match cssFontProp contained "\<scroll-snap-\(type\|points-\(x\|y\)\|destination\|coordinate\)\=\>"
+syn keyword cssFontAttr contained mandatory proximity

after/syntax/css/css-text-4.vim

@@ -0,0 +1,14 @@
+syn match cssTextProp contained "\<text-space-\(collapse\|trim\)\>"
+syn match cssTextProp contained "\<text-\(wrap\|spacing\)\>"
+syn match cssTextProp contained "\<wrap-\(before\|after\|inside\)\>"
+syn match cssTextProp contained "\<hyphenate-\(character\|limit-\(zone\|chars\|lines\|last\)\)\>"
+syn keyword cssTextAttr contained spread punctuation
+syn match cssTextAttr contained "\<preserve-\(auto\|trim\|breaks\|spaces\)\>"
+syn match cssTextAttr contained "\<trim-inner\>"
+syn match cssTextAttr contained "\<discard-\(before\|after\)\>"
+syn match cssTextAttr contained "\<avoid-\(line\|flex\)\>"
+syn match cssTextAttr contained "\<pre-wrap-auto\>"
+syn match cssTextAttr contained "\<no-limit\>"
+syn match cssTextAttr contained "\<\(trim\|space\)-\(start\|end\|adjacent\)\>"
+syn match cssTextAttr contained "\<no-compress\>"
+syn match cssTextAttr contained "\<ideograph-\(alpha\|numeric\)\>"

after/syntax/css/css-ui-3.vim

@@ -0,0 +1,2 @@
+syn match cssUIProp contained "\<caret-color\>"
+syn keyword cssUIAttr contained grab grabbing

after/syntax/css/css-ui-4.vim

@@ -0,0 +1,3 @@
+syn match cssUIProp contained "\<caret\(-\(shape\|animation\)\)\=\>"
+syn keyword cssUIAttr contained fade underscore
+syn region cssFunction contained matchgroup=cssFunctionName start="\<fade\s*(" end=")" oneline keepend

after/syntax/css/css-values.vim

@@ -0,0 +1,3 @@
+syn match cssValueLength contained "[-+]\=\d\+\(\.\d*\)\=\(ch\|vw\|vh\|vmin\|vmax\|q\)"
+syn match cssValueAngle contained "[-+]\=\d\+\(\.\d*\)\=turn"
+syn region cssFunction contained matchgroup=cssFunctionName start="\<\(calc\|toggle\)\s*(" end=")" oneline keepend

after/syntax/css/css3-cascade.vim

@@ -1,3 +0,0 @@
-" TODO: create cssCascadeProp and cssCascadeAttr
-syn keyword cssFontProp all
-syn keyword cssFontAttr unset

after/syntax/css/css3-hyperlinks.vim

@@ -1,3 +0,0 @@
-" TODO: create cssHyperlinksProp group and cssHyperlinksAttr group
-syn match cssFontProp contained "\<target\(-\(name\|new\|position\)\)\=\>"
-syn keyword cssFontAttr contained current new modal window tab front back

after/syntax/css/css3-layout.vim

@@ -1,3 +0,0 @@
-" TODO: create cssLayoutAttr group
-syn keyword cssFontAttr contained same
-syn keyword cssPseudoClassId contained slot

after/syntax/css/css3-linebox.vim

@@ -1,16 +0,0 @@
-" TODO: create cssLineboxProp group and cssLineboxAttr group
-syn match cssFontProp contained "\<alignment-\(adjust\|baseline\)\>"
-syn match cssFontProp contained "\<baseline-shift\>"
-syn match cssFontProp contained "\<dominate-baseline\>"
-syn match cssFontProp contained "\<drop-initial-\(after-\(adjust\|align\)\|before-\(adjust\|align\)\|size\|value\)\>"
-syn match cssFontProp contained "\<inline-box-align\>"
-syn match cssFontProp contained "\<line-stacking\(-\(ruby\|shift\|strategy\)\)\=\>"
-syn match cssFontProp contained "\<text-height\>"
-syn keyword cssFontAttr contained central mathematical
-syn match cssFontAttr contained "\<\(text-\)\=\(before\|after\)-edge\>"
-syn match cssFontAttr contained "\<use-script\>"
-syn match cssFontAttr contained "\<caps-height\>"
-syn match cssFontAttr contained "\<\(exclude\|include\)-ruby\>"
-syn match cssFontAttr contained "\<\(consider\|disregard\)-shift\>"
-syn match cssFontAttr contained "\<\(\(inline\|block\)-line\|max\|grid\)-height\>"
-syn match cssFontAttr contained "\<\(font\|text\|max\)-size\>"

after/syntax/css/css3-marquee.vim

@@ -1,4 +0,0 @@
-" TODO: create cssMarqueeProp group and cssMarqueeAttr group
-syn match cssFontProp contained "\<marquee-\(direction\|play-count\|speed\|style\)\>"
-syn keyword cssFontAttr contained forward reverse infinite slide alternate
-syn match cssFontAttr contained "\<marquee-\(line\|block\)\>"

after/syntax/css/css3-positioning.vim

@@ -0,0 +1,3 @@
+" TODO: create cssPositioningProp and cssPositioningAttr
+syn match cssFontProp contained "\<offset-\(before\|end\|after\|start\)\>"
+syn keyword cssFontAttr contained sticky

after/syntax/css/css3-preslev.vim

@@ -1,3 +0,0 @@
-" TODO: create cssPresLevProp group and cssPresLevAttr group
-syn match cssFontProp contained "\<presentation-level\>"
-syn keyword cssFontAttr contained increment

after/syntax/css/css3-ui.vim

@@ -1,7 +0,0 @@
-syn keyword cssUIProp contained icon resize
-syn match cssUIProp contained "\<box-sizing\>"
-syn match cssUIProp contained "\<ime-mode\>"
-syn match cssUIProp contained "\<nav-\(index\|up\|right\|down\|left\)"
-syn match cssUIProp contained "\<outline-offset\>"
-syn match cssUIProp contained "\<text-overflow\>"
-syn keyword cssUIAttr contained active inactive disabled root horizontal vertical clip ellipsis

after/syntax/css/css3-values.vim

@@ -1,6 +0,0 @@
-syn match cssValueLength contained "[-+]\=\d\+\(\.\d*\)\=\(ch\|rem\|vw\|vh\|vmin\|vmax\)"
-syn match cssValueAngle contained "[-+]\=\d\+\(\.\d*\)\=turn"
-" TODO: create cssValueResolution group
-syn match cssValueNumber contained "[-+]\=\d\+\(\.\d*\)\=dp\(i\|cm\|px\)"
-syn region cssFunction contained matchgroup=cssFunctionName start="\<\(calc\|toggle\)\s*(" end=")" oneline keepend
-syn keyword cssCommonAttr contained initial

after/syntax/html.vim

@@ -1,46 +1,50 @@
 syn include @htmlCss syntax/css/html5-elements.vim
 syn include @htmlCss syntax/css/compositing-1.vim
-syn include @htmlCss syntax/css/css3-align.vim
 syn include @htmlCss syntax/css/css3-animations.vim
 syn include @htmlCss syntax/css/css3-background.vim
 syn include @htmlCss syntax/css/css3-box.vim
 syn include @htmlCss syntax/css/css3-break.vim
-syn include @htmlCss syntax/css/css3-cascade.vim
 syn include @htmlCss syntax/css/css3-colors.vim
 syn include @htmlCss syntax/css/css3-conditional.vim
 syn include @htmlCss syntax/css/css3-content.vim
 syn include @htmlCss syntax/css/css3-exclusions.vim
 syn include @htmlCss syntax/css/css3-fonts.vim
-syn include @htmlCss syntax/css/css3-hyperlinks.vim
 syn include @htmlCss syntax/css/css3-images.vim
-syn include @htmlCss syntax/css/css3-layout.vim
-syn include @htmlCss syntax/css/css3-linebox.vim
-syn include @htmlCss syntax/css/css3-marquee.vim
 syn include @htmlCss syntax/css/css3-multicol.vim
 syn include @htmlCss syntax/css/css3-page.vim
-syn include @htmlCss syntax/css/css3-preslev.vim
+syn include @htmlCss syntax/css/css3-positioning.vim
 syn include @htmlCss syntax/css/css3-regions.vim
-syn include @htmlCss syntax/css/css3-ruby.vim
 syn include @htmlCss syntax/css/css3-selectors.vim
 syn include @htmlCss syntax/css/css3-sizing.vim
 syn include @htmlCss syntax/css/css3-speech.vim
 syn include @htmlCss syntax/css/css3-transforms.vim
 syn include @htmlCss syntax/css/css3-transitions.vim
-syn include @htmlCss syntax/css/css3-ui.vim
+syn include @htmlCss syntax/css/css-align-3.vim
-syn include @htmlCss syntax/css/css3-values.vim
+syn include @htmlCss syntax/css/css-cascade-3.vim
+syn include @htmlCss syntax/css/css-cascade-4.vim
 syn include @htmlCss syntax/css/css-counter-styles-3.vim
 syn include @htmlCss syntax/css/css-display-3.vim
 syn include @htmlCss syntax/css/css-flexbox-1.vim
 syn include @htmlCss syntax/css/css-gcpm-3.vim
 syn include @htmlCss syntax/css/css-grid-1.vim
+syn include @htmlCss syntax/css/css-inline-3.vim
 syn include @htmlCss syntax/css/css-line-grid-1.vim
 syn include @htmlCss syntax/css/css-lists-3.vim
 syn include @htmlCss syntax/css/css-masking-1.vim
 syn include @htmlCss syntax/css/css-overflow-3.vim
+syn include @htmlCss syntax/css/css-pseudo-4.vim
+syn include @htmlCss syntax/css/css-page-floats-3.vim
+syn include @htmlCss syntax/css/css-round-display-1.vim
+syn include @htmlCss syntax/css/css-ruby-1.vim
 syn include @htmlCss syntax/css/css-scoping-1.vim
 syn include @htmlCss syntax/css/css-shapes-1.vim
+syn include @htmlCss syntax/css/css-snappoints-1.vim
 syn include @htmlCss syntax/css/css-text-3.vim
+syn include @htmlCss syntax/css/css-text-4.vim
 syn include @htmlCss syntax/css/css-text-decor-3.vim
+syn include @htmlCss syntax/css/css-ui-3.vim
+syn include @htmlCss syntax/css/css-ui-4.vim
+syn include @htmlCss syntax/css/css-values.vim
 syn include @htmlCss syntax/css/css-variables.vim
 syn include @htmlCss syntax/css/css-will-change-1.vim
 syn include @htmlCss syntax/css/css-writing-modes-3.vim

after/syntax/scss.vim

@@ -1,3 +1 @@
 runtime! syntax/css/*.vim
-syn clear cssMediaBlock
-syn region cssMediaBlock contained transparent matchgroup=cssBraces start='{' end='}' contains=TOP

test/test.css

@@ -61,8 +61,14 @@
   box-decoration-break: auto;
 }
 
-.cascade {
+.cascade-3 {
-  all: unset;
+  all: initial;
+  display: unset;
+}
+
+@import "test.css" supports(display: auto);
+.cascade-4 {
+  display: revert;
 }
 
 .colors {
@@ -104,23 +110,63 @@
   display: last;
 }
 
-.counter-styles {
+@counter-style counter-style {
-  negative: disclosure-open;
+  system: cyclic;
-  prefix: disclosure-closed;
+  negative: symbolic;
-  suffix: simp-chinese-informal;
+  prefix: additive;
-  range: simp-chinese-formal;
+  suffix: extends;
-  pad: trad-chinese-informal;
+  range: bullets;
-  fallback: trad-chinese-formal;
+  pad: numbers;
-  symbols: ethiopic-numeric;
+  fallback: words;
-  additive-symbols: symbols("*" "\2020" "\2021" "\A7");
+  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;
+  box-suppress: flow;
-  display-outside: inline-level;
+  display: flow-root;
-  display-extras: inline-list-item;
+  display: contents;
-  display-box: contents;
+  display: inline-list-item;
+  display: discard;
 }
 
 .exclusions {
@@ -136,7 +182,7 @@
   flex: column-reverse;
   flex-grow: wrap;
   flex-shrink: wrap-reverse;
-  flex-basis: auto;
+  flex-basis: main-size;
 }
 
 .fonts {
@@ -192,33 +238,26 @@
   display: closed;
 }
 
-.grid-layout {
+.grid {
   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-flow: dense;
-  grid-auto-position: columns;
+  grid-auto-position: span;
-  grid: dense;
+  grid: auto;
-  grid-row-start: span;
+  grid-row-start: auto;
   grid-column-start: auto;
   grid-row-end: auto;
   grid-column-end: auto;
   grid-column: auto;
   grid-row: auto;
   grid-area: auto;
-}
+  grid-column-gap: auto;
-
+  grid-row-gap: auto;
-.hyperlinks {
+  grid-gap: auto;
-  target: current;
-  target-name: new;
-  target-new: modal;
-  target-position: window;
-  display: tab;
-  display: front;
-  display: back;
 }
 
 .images {
@@ -234,38 +273,21 @@
   display: repeating-radial-gradient(farthest-corner at 50% 50%, yellow, green);
 }
 
-.layout::slot(b) {
+.inline {
-  display: same;
+  dominant-baseline: mathematical;
+  alignment-baseline: ideographic;
+  baseline-shift: auto;
+  initial-letter: auto;
+  initial-letter-align: auto;
+  initial-letter-wrap: auto;
 }
 
 .line-grid {
   line-grid: create;
-  line-snap: half-border;
+  line-snap: block-start;
-  line-slack: rounddown(1em);
+  box-snap: block-end;
-  box-snap: roundup(1em);
+  display: first-baseline;
-  display: 10gd;
+  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 {
@@ -274,16 +296,6 @@
   display: counters(list-item, '.');
 }
 
-.marquee {
-  marquee-direction: forward;
-  marquee-play-count: reverse;
-  marquee-speed: infinite;
-  marquee-style: slide;
-  display: alternate;
-  display: marquee-line;
-  display: marquee-block;
-}
-
 .masking {
   clip-path: fill-box;
   clip-rule: stroke-box;
@@ -334,8 +346,27 @@
   display: verso;
 }
 
-.preslev {
+.page-floats-3 {
-  presentation-level: increment;
+  float-reference: inline-start;
+  float-defer: inline-end;
+  float-offset: snap-block;
+  display: snap-inline;
+  display: snap-block(2em, near);
+  display: snap-inline(2em, near);
+}
+
+.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 {
@@ -346,10 +377,19 @@
   display: avoid-region;
 }
 
+@media (device-radius: 50%) {
+  .round-display-1 {
+    shape-inside: outside-shape;
+    border-boundary: shape-box;
+    polar-angle: parent;
+    polar-distance: polar;
+  }
+}
+
 .ruby {
+  ruby-position: ruby-base-container;
   ruby-merge: ruby-text-container;
   ruby-align: inter-character;
-  ruby-position: ruby-base-container;
 }
 
 @scope .scoping {
@@ -438,6 +478,14 @@
   display: contain-floats;
 }
 
+.snappoints {
+  scroll-snap-type: mandatory;
+  scroll-snap-points-x: proximity;
+  scroll-snap-points-y: auto;
+  scroll-snap-destination: auto;
+  scroll-snap-coordinate: auto;
+}
+
 .speech {
   voice-volume: 10dB;
   voice-balance: literal-punctuation;
@@ -455,7 +503,7 @@
   display: reduced;
 }
 
-.text {
+.text-3 {
   hyphens: manual;
   line-break: loose;
   overflow-wrap: strict;
@@ -465,6 +513,31 @@
   display: full-width;
 }
 
+.text-4 {
+  text-space-collapse: preserve-auto;
+  text-space-trim: preserve-trim;
+  text-wrap: preserve-breaks;
+  wrap-before: preserve-spaces;
+  wrap-after: trim-inner;
+  wrap-inside: discard-before;
+  hyphenate-character: discard-after;
+  hyphenate-limit-zone: avoid-line;
+  hyphenate-limit-chars: avoid-flex;
+  hyphenate-limit-lines: pre-wrap-auto;
+  hyphenate-limit-last: no-limit;
+  text-spacing: spread;
+  display: trim-start;
+  display: space-start;
+  display: trim-end;
+  display: space-end;
+  display: trim-adjacent;
+  display: space-adjacent;
+  display: no-compress;
+  display: ideograph-alpha;
+  display: ideograph-numeric;
+  display: punctuation;
+}
+
 .text-decor-3 {
   text-decoration-color: filled;
   text-decoration-line: dot;
@@ -519,32 +592,26 @@
   display: cubic-bezier(0.25, 0.1, 0.25, 1.0);
 }
 
-.ui {
+.ui-3 {
-  icon: active;
+  caret-color: grab;
-  resize: inactive;
+  display: grabbing;
-  box-sizing: disabled;
+}
-  ime-mode: root;
+
-  nav-index: horizontal;
+.ui-4 {
-  nav-up: vertical;
+  caret: fade;
-  nav-right: clip;
+  caret-shape: fade(1em);
-  nav-down: ellipsis;
+  caret-animation: underscore;
-  nav-left: auto;
-  outline-offset: auto;
 }
 
 .values {
   display: 1ch;
-  display: 1rem;
   display: 1vw;
   display: 1vh;
   display: 1vmin;
+  display: 1q;
   display: 1turn;
-  display: 1dpi;
-  display: 1dpcm;
-  display: 1dppx;
   display: calc(100%/3 - 2*1em - 2*1px);
   display: toggle(italic, normal);
-  display: initial;
 }
 
 .variables {