/* SYNTAX TEST "Packages/CSS/CSS.sublime-syntax" */

   /* What am I, a comment? */
/* ^^ punctuation.definition.comment.css */
/* ^^^^^^^^^^^^^^^^^^^^^^^^^^^ comment.block.css */
/*                          ^^ punctuation.definition.comment.css */

   /**
    *
/*  ^ comment.block.css punctuation.definition.comment.css */

.test-strings {
    content: "double";
/*           ^^^^^^^^ string.quoted.double.css */
/*           ^ punctuation.definition.string.begin.css */
/*                  ^ punctuation.definition.string.end.css */
    content: 'single';
/*           ^^^^^^^^ string.quoted.single.css */
/*           ^ punctuation.definition.string.begin.css */
/*                  ^ punctuation.definition.string.end.css */

    content: 'invalid;
/*                    ^ invalid.illegal.newline.css */
}

.test-punctuation {
/*                ^ punctuation.section.property-list.css */
    top: 1px;
/*     ^ punctuation.separator.key-value.css */
/*          ^ punctuation.terminator.rule.css */

    top: cubic-bezier(0.2, 0, 0.13, 2);
/*                    ^^^ constant.numeric.float.decimal.css */
/*                     ^ punctuation.separator.decimal.css */
/*                       ^ punctuation.separator.sequence.css*/
/*                         ^ constant.numeric.integer.decimal.css  */
/*                          ^ punctuation.separator.sequence.css*/
/*                            ^^^^ constant.numeric.float.decimal.css */
/*                             ^ punctuation.separator.decimal.css */

    top: url("image");
/*          ^ punctuation.definition.group.begin.css */
/*                  ^ punctuation.definition.group.end.css */
}
/* < punctuation.section.property-list.css */

    .classname {}
/*^^ - meta.selector.css */
/*  ^^^^^^^^^^^ meta.selector.css */
/*             ^^ - meta.selector.css */
/*  ^ punctuation.definition.entity.css */
/*   ^^^^^^^^^ entity.other.attribute-name.class.css */

    #id {}
/*^^ - meta.selector.css */
/*  ^^^^ meta.selector.css */
/*      ^^ - meta.selector.css */
/*  ^ punctuation.definition.entity.css */
/*   ^^ entity.other.attribute-name.id.css */

    html, h1 {}
/*^^ - meta.selector.css */
/*  ^^^^^^^^^ meta.selector.css */
/*           ^^ - meta.selector.css */
/*  ^^^^ entity.name.tag.css */
/*      ^ punctuation.separator.sequence.css */
/*        ^^ entity.name.tag.css */
/*           ^ punctuation.section.property-list.css */
/*            ^ punctuation.section.property-list.css */

    @charset "UTF-8";
/*  ^^^^^^^^^^^^^^^^ meta.at-rule.charset.css */
/*  ^ punctuation.definition.keyword.css */
/*   ^^^^^^^ keyword.control.at-rule.charset.css */

    @import "x" print;
/*  ^^^^^^^^^^^^^^^^^ meta.at-rule.import.css */
/*  ^ punctuation.definition.keyword.css */
/*   ^^^^^^ keyword.control.at-rule.import.css */
/*              ^^^^^ support.constant.media.css */

    @namespace svg "http://www.w3.org/1999/xhtml";
/*  ^^^^^^^^^^^^^^^^^ meta.at-rule.namespace.css */
/*  ^ punctuation.definition.keyword.css */
/*   ^^^^^^^^^ keyword.control.at-rule.namespace.css */
/*             ^^^ entity.other.namespace-prefix.css */

    @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */
/*  ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.at-rule.namespace.css */
/*             ^^^ support.function.url.css */
/*             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.function-call.css */
/*                ^ meta.group.css punctuation.definition.group.begin.css */
/*                 ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.group.css string.quoted.double.css */
/*                                                                                ^ meta.group.css punctuation.definition.group.end.css */

    @page :left {}
/*  ^^^^^^^^^^^^^^ meta.at-rule.page.css */
/*  ^ punctuation.definition.keyword.css */
/*   ^^^^ keyword.control.at-rule.page.css */

    @media only screen {}
/*  ^^^^^^^^^^^^^^^^^^^ meta.at-rule.media.css */
/*  ^ punctuation.definition.keyword.css */
/*   ^^^^^ keyword.control.at-rule.media.css */
/*         ^^^^ keyword.operator.logic.media.css */
/*              ^^^^^^ support.constant.media.css */

    @media (min-width: 700px) {}
/*  ^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.at-rule.media.css */
/*  ^ punctuation.definition.keyword.css */
/*   ^^^^^ keyword.control.at-rule.media.css */
/*         ^ punctuation.definition.group.begin.css */
/*          ^^^^^^^^^ support.type.property-name.media.css */
/*                     ^^^^^ constant.numeric.integer.decimal.css */
/*                          ^ punctuation.definition.group.end.css */

    @media (min-width: 700px) and (max-width: 2000px) {}
/*  ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.at-rule.media.css */
/*  ^ punctuation.definition.keyword.css */
/*   ^^^^^ keyword.control.at-rule.media.css */
/*         ^ punctuation.definition.group.begin.css */
/*          ^^^^^^^^^ support.type.property-name.media.css */
/*                     ^^^^^ constant.numeric.integer.decimal.css */
/*                          ^ punctuation.definition.group.end.css */
/*                            ^^^ keyword.operator.logic */
/*                                ^ punctuation.definition.group.begin.css */
/*                                 ^^^^^^^^^ support.type.property-name.media.css */
/*                                            ^^^^^^ constant.numeric.integer.decimal.css */
/*                                                  ^ punctuation.definition.group.end.css */

    @media only screen and (-webkit-min-device-pixel-ratio: /* comment */ 1.3),
/*  ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.at-rule.media.css */
/*  ^ punctuation.definition.keyword.css */
/*   ^^^^^ keyword.control.at-rule.media.css */
/*         ^^^^ keyword.operator.logic.media.css */
/*              ^^^^^^ support.constant.media.css */
/*                     ^^^ keyword.operator.logic.media.css */
/*                         ^ punctuation.definition.group.begin.css */
/*                          ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ support.type.property-name.media.css */
/*                                                        ^ punctuation.separator.key-value.css */
/*                                                          ^^^^^^^^^^^^^ comment.block.css */
/*                                                                        ^^^ constant.numeric.float.decimal.css */
/*                                                                           ^ punctuation.definition.group.end.css */
/*                                                                            ^ punctuation.definition.arbitrary-repetition */
    only screen and (-o-min-device-pixel-ratio: 13/10),
/*  ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.at-rule.media.css */
/*  ^^^^ keyword.operator.logic.media.css */
/*       ^^^^^^ support.constant.media.css */
/*              ^^^ keyword.operator.logic.media.css */
/*                  ^ punctuation.definition.group.begin.css */
/*                   ^^^^^^^^^^^^^^^^^^^^^^^^^ support.type.property-name.media.css */
/*                                            ^ punctuation.separator.key-value.css */
/*                                              ^^ constant.numeric.integer.decimal.css */
/*                                                ^ keyword.operator */
/*                                                 ^^ constant.numeric.integer.decimal.css */
/*                                                   ^ punctuation.definition.group.end.css */
/*                                                    ^ punctuation.definition.arbitrary-repetition */
    only screen and (min-resolution: 120dpi)
/*  ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.at-rule.media.css */
/*  ^^^^ keyword.operator.logic.media.css */
/*       ^^^^^^ support.constant.media.css */
/*              ^^^ keyword.operator.logic.media.css */
/*                  ^ punctuation.definition.group.begin.css */
/*                   ^^^^^^^^^^^^^^ support.type.property-name.media.css */
/*                                 ^ punctuation.separator.key-value.css */
/*                                   ^^^^^^ constant.numeric.integer.decimal.css */
/*                                         ^ punctuation.definition.group.end.css */
{}

    @custom-media --a-b (width: 1px);
/*  ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.at-rule.custom-media.css */
/*  ^ punctuation.definition.keyword.css */
/*   ^^^^^^^^^^^^ keyword.control.at-rule.custom-media.css */
/*                       ^^^^^ support.type.property-name.media.css */

    @keyframes beat, bounce {}
/*  ^^^^^^^^^^^^^^^^^^^^^^^^ meta.at-rule.keyframe.css */
/*  ^ punctuation.definition.keyword.css */
/*   ^^^^^^^^^ keyword.control.at-rule.keyframe.css */
/*             ^^^^ entity.other.animation-name.css */
/*                 ^ punctuation.definition.arbitrary-repetition.css */
/*                   ^^^^^^ entity.other.animation-name.css */

@keyframes test-keyframes-keywords {
    from, to {}
/*  ^^^^ keyword.keyframe-selector.css */
/*      ^ punctuation.separator.sequence.css */
/*        ^^ keyword.keyframe-selector.css */

    0%, 100% {}
/*  ^^ constant.numeric.integer.decimal.css */
/*   ^ keyword.other.unit.css */
/*    ^ punctuation.separator.sequence.css */
/*      ^^^^ constant.numeric.integer.decimal.css */
/*         ^ keyword.other.unit.css */

    .99%, 100.99% {}
/*  ^^^^ constant.numeric.float.decimal.css */
/*  ^ punctuation.separator.decimal.css */
/*     ^ keyword.other.unit.css */
/*      ^ punctuation.separator.sequence.css */
/*        ^^^^^^^ constant.numeric.float.decimal.css */
/*           ^ punctuation.separator.decimal.css */
/*              ^ keyword.other.unit.css */

    0%, to {}
/*  ^^ constant.numeric.integer.decimal.css */
/*   ^ keyword.other.unit.css */
/*    ^ punctuation.separator.sequence.css */
/*      ^^ keyword.keyframe-selector.css */
}

    @document url(http://) { }
/*  ^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.at-rule.document.css */
/*  ^ punctuation.definition.keyword.css */
/*  ^^^^^^^^^ keyword.control.at-rule.document.css */
/*                         ^^^ meta.block.css */
/*                         ^ punctuation.definition.block.begin.css */
/*                           ^ punctuation.definition.block.end.css */

@document url(http://www),
/*        ^^^ support.function.url.css */
/*            ^^^^^^^^^^ string.unquoted.css */
/*                       ^ punctuation.separator.sequence.css */
          url-prefix("http://www"),
/*        ^^^^^^^^^^ support.function.url-prefix.css */
/*                   ^^^^^^^^^^^^ string.quoted.double.css */
          domain(mozilla.org),
/*        ^^^^^^ support.function.domain.css */
/*               ^^^^^^^^^^^ string.unquoted.css */
          regexp("https:.*")
/*        ^^^^^^ support.function.regexp.css */
/*               ^^^^^^^^^^ string.quoted.double.css */
{
    .class {
/*  ^^^^^^ meta.at-rule.document.css entity.other.attribute-name.class.css */
        display: none;
/*      ^^^^^^^ meta.at-rule.document.css meta.property-name.css */
    }
}

    @font-face {
/*  ^^^^^^^^^^^ meta.at-rule.font-face.css */
/*  ^ punctuation.definition.keyword.css */
/*   ^^^^^^^^^ keyword.control.at-rule.font-face.css */

    src: local(Font),
        /* */
/*      ^^^^^ comment.block.css */
}

    @font-face
/*  ^^^^^^^^^^^ meta.at-rule.font-face.css */
/*  ^ punctuation.definition.keyword.css */
/*   ^^^^^^^^^ keyword.control.at-rule.font-face.css */
{
    font-family: monospace,
/*  ^^^^^^^^^^^ support.type.property-name.css */
/*               ^^^^^^^^^ support.constant.font-name.css */
        /* */
/*      ^^^^^ comment.block.css */
}

    @supports not ( and ( top: 2px ) ) { }
/*  ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.at-rule.supports.css */
/*  ^ punctuation.definition.keyword.css */
/*   ^^^^^^^^ keyword.control.at-rule.supports.css */
/*            ^^^ keyword.operator.logic.css */
/*                ^ meta.group.css punctuation.definition.group.begin.css */
/*                  ^^^ keyword.operator.logic.css */
/*                      ^ meta.group.css punctuation.definition.group.begin.css */
/*                        ^^^ support.type.property-name.css */
/*                           ^ punctuation.separator.key-value.css */
/*                              ^^ constant.numeric.integer.decimal.css keyword.other.unit.css */
/*                                 ^ meta.group.css punctuation.definition.group.end.css */
/*                                   ^ meta.group.css punctuation.definition.group.end.css */
/*                                     ^^^ meta.block.css */
/*                                     ^ punctuation.definition.block.begin.css */
/*                                       ^ punctuation.definition.block.end.css */

@supports (--foo: green) {
/*         ^^^^^ support.type.custom-property.css */
    .class {
/*  ^^^^^^ meta.at-rule.supports.css entity.other.attribute-name.class.css */
        display: none;
/*      ^^^^^^^ meta.at-rule.supports.css meta.property-name.css */
    }
}

@supports (display: grid) {span { display: grid; }}
/*                         ^^^^ meta.at-rule.supports.css meta.selector.css */

    @counter-style {}
/*  ^ punctuation.definition.keyword.css */
/*  ^^^^^^^^^^^^^^ keyword.control.at-rule.counter-style.css */

@counter-style none {}
/*             ^^^^ invalid.illegal.counter-style-name.css */

@counter-style decimal {}
/*             ^^^^^^^ invalid.illegal.counter-style-name.css */

    @counter-style name {
/*  ^ punctuation.definition.keyword.css */
/*  ^^^^^^^^^^^^^^ keyword.control.at-rule.counter-style.css */
/*                 ^^^^ entity.other.counter-style-name.css */
    symbols: "‣";
/*  ^^^^^^^ meta.at-rule.counter-style.css support.type.property-name.css */
    suffix: " ";
/*  ^^^^^^ meta.at-rule.counter-style.css support.type.property-name.css */
/*          ^^^ string.quoted.double.css */
}

    @counter-style blacknwhite
/*  ^^^^^^^^^^^^^^ meta.at-rule.counter-style.css keyword.control.at-rule.counter-style.css */
/*                 ^^^^^^^^^^^ entity.other.counter-style-name.css */
{
  system: cyclic;
  negative: "(" ")";
  prefix: "/";
  symbols: ◆ ◇;
  suffix: "/ ";
  range: 2 4;
  speak-as: "bullets";
/*^^^^^^^^ support.type.property-name.css */
}

.test-var { --test-var: arial; }
/*          ^^^^^^^^^^ support.type.custom-property.css */
/*          ^^ punctuation.definition.custom-property */
/*            ^^^^^^^^ support.type.custom-property.name.css */

.test-deprecated-var { var-deprecated- }
/*                     ^^^^^^^^^^^^^^^ invalid.deprecated.custom-property.css */
/*                     ^^^^ keyword.other.custom-property.prefix.css */

.test-types {
    top: 20;
/*       ^^ constant.numeric.integer.decimal.css */
    top: +.95e-20;
/*       ^^^^^^^^ constant.numeric.float.decimal.css */
/*        ^ punctuation.separator.decimal.css */
    top: +1e1e1 .1e1e1;
/*       ^^^^ constant.numeric.float.decimal.css */
/*           ^ - constant.numeric */
/*              ^^^^ constant.numeric.float.decimal.css */
/*                  ^ - constant.numeric */
    top: -1.5e+93%;
/*       ^^^^^^^^^ constant.numeric.float.decimal.css */
/*         ^ punctuation.separator.decimal.css */
}

.test-units {
    top: 1px;
/*       ^^^ constant.numeric.integer.decimal.css */
/*        ^^ keyword.other.unit.css */
    top: 1.1em;
/*       ^^^^^ constant.numeric.float.decimal.css */
/*        ^ punctuation.separator.decimal.css */
/*          ^^ keyword.other.unit.css */
    top: -100%;
/*       ^^^^^ constant.numeric.integer.decimal.css */
/*           ^ keyword.other.unit.css */
    top: 1.1.1deg;
/*       ^^^^^^^^ constant.numeric.float.decimal.css */
/*        ^ punctuation.separator.decimal.css */
/*          ^ punctuation.separator.decimal.css */
/*            ^^^ keyword.other.unit.css */
}

.test-properties {
/*               ^ meta.property-list.css */

    -webkit-transform: none;
/*  ^^^^^^^^^^^^^^^^^ meta.property-name.css */
/*  ^^^^^^^^ support.type.vendor-prefix.css */
/*          ^^^^^^^^^ support.type.property-name.css */
/*                     ^^^^ meta.property-value.css support.constant.property-value.css */
}

.test-operators {
    top: calc(1px + 1px);
    /*            ^ keyword.operator.css */
    top: calc(1px - 1px);
    /*            ^ keyword.operator.css */
    top: calc(1px / 1px);
    /*            ^ keyword.operator.css */
    top: calc(1px * 1px);
    /*            ^ keyword.operator.css */

    top: calc(1px+1px);
    /*           ^ -keyword.operator.css */
    top: calc(1px-1px);
    /*           ^ -keyword.operator.css */
    top: calc(1px/1px);
    /*           ^ keyword.operator.css */
    top: calc(1px*1px);
    /*           ^ keyword.operator.css */
}

.test-important {
    top: 1px !important;
/*           ^^^^^^^^^^ keyword.other.important.css */
    top: 1px!important;
/*          ^^^^^^^^^^ keyword.other.important.css */
}

/* Test Functional Pseudo Class Meta Scopes */
.test:nth-child(even) {}
/*^^^^^^^^^^^^^^^^^^^^ meta.selector.css */
/*                    ^ - meta.selector.css */
/*   ^^^^^^^^^^^^^^^^ meta.function-call.css */
/*             ^^^^^^ meta.group.css */
/*             ^ punctuation.definition.group.begin.css */
/*                  ^ punctuation.definition.group.end.css */

.test:nth-child(+2n + 3) {}
/*              ^^^ constant.numeric.integer.decimal.css */
/*                 ^ - constant */
/*                  ^^^ constant.numeric.integer.decimal.css */

.test:nth-child(-n+ 3) {}
/*              ^^^^^ constant.numeric.integer.decimal.css */

.test:nth-child(-n +3) {}
/*              ^^ constant.numeric.integer.decimal.css */
/*                ^ - constant */
/*                 ^^ constant.numeric.integer.decimal.css */

.test:nth-child(+3) {}
/*              ^^ constant.numeric.integer.decimal.css */

.test:nth-child(+ 3) {}
/*              ^^^ invalid.illegal.numeric.css */

.test:nth-child(+ 3n) {}
/*              ^^^ invalid.illegal.numeric.css */

.test:nth-child(+3 n) {}
/*              ^^^^ invalid.illegal.numeric.css */

.test-pseudo-classes:nth-child(2):hover {}
/*^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.selector.css */
/*                                      ^ - meta.selector.css */
/*                   ^^^^^^^^^ entity.other.pseudo-class.css */
/*                             ^ constant.numeric.integer.decimal.css */
/*                               ^ punctuation.definition.entity.css */
/*                                ^^^^^ entity.other.pseudo-class.css */

.test-pseudo-class-numerics:nth-last-of-type(-n+3) {}
/*                         ^^^^^^^^^^^^^^^^^ entity.other.pseudo-class.css */
/*                                           ^^^^ constant.numeric.integer.decimal.css */

.test-pseudo-class-keywords:nth-of-type(odd) {}
/*                         ^^^^^^^^^^^^ entity.other.pseudo-class.css */
/*                                      ^^^ keyword.other.pseudo-class.css */

.test-pseudo-class-strings:dir(ltr) {}
/*                        ^^^^ entity.other.pseudo-class.css */
/*                             ^^^ string.unquoted.css */

.test-pseudo-class-tag:not(*) {}
/*                    ^^^^ entity.other.pseudo-class.css */
/*                         ^ entity.name.tag.wildcard.css */

.test-pseudo-elements::before {}
/*                   ^^ punctuation.definition.entity.css */
/*                   ^^^^^^^^ entity.other.pseudo-element.css */

.test-pseudo-elements:after {}
/*                   ^ punctuation.definition.entity.css */
/*                   ^^^^^^ entity.other.pseudo-element.css */

.test-pseudo-elements::-webkit-slider-runnable-track
/*                   ^^ punctuation.definition.entity.css */
/*                   ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ entity.other.pseudo-element.css */

.test-unicode { top: "\2764 \273e"; }
/*                    ^^^^^ constant.character.escape.css */
/*                          ^^^^^ constant.character.escape.css */

.test-unicode-range {
    unicode-range: U+0025-00FF, U+4??;
/*                 ^^^^^^^^^^^ support.unicode-range.css */
/*                 ^^ support.constant.unicode-range.prefix.css */
/*                   ^^^^^^^^^ constant.codepoint-range.css */
/*                       ^ punctuation.section.range.css */
/*                              ^^^^^ support.unicode-range.css */
/*                              ^^ support.constant.unicode-range.prefix.css */
/*                                ^^^ constant.codepoint-range.css */
}

.test-escape-character { top: "\nstring\n"; }
/*                             ^^ constant.character.escape.css */
/*                                     ^^ constant.character.escape.css */

.test-attribute-selectors[disabled][type=button] {}
/*                       ^^^^^^^^^^ meta.attribute-selector.css */
/*                       ^ punctuation.definition.entity.css */
/*                        ^^^^^^^^ entity.other.attribute-name.css */
/*                                ^ punctuation.definition.entity.css */
/*                                  ^^^^ entity.other.attribute-name.css */
/*                                       ^^^^^^ string.unquoted.css */

.test-attribute-selectors-namespaces[n|a=""][*|a=""][|att] {}
/*                                   ^ entity.other.namespace-prefix.css */
/*                                    ^ punctuation.separator.namespace.css */
/*                                           ^ entity.name.namespace.wildcard.css */
/*                                            ^ punctuation.separator.namespace.css */
/*                                                   ^ punctuation.separator.namespace.css */

.test-attribute-selectors-operators[a=""][a~=""][a|=""][a^=""][a$=""][a*=""] {}
/*                                   ^ keyword.operator.attribute-selector.css */
/*                                         ^^ keyword.operator.attribute-selector.css */
/*                                                ^^ keyword.operator.attribute-selector.css */
/*                                                       ^^ keyword.operator.attribute-selector.css */
/*                                                              ^^ keyword.operator.attribute-selector.css */
/*                                                                     ^^ keyword.operator.attribute-selector.css */

.test-attribute-selectors-whitespace[a = ""] {}
/*                                   ^ entity.other.attribute-name.css */
/*                                     ^ keyword.operator.attribute-selector.css */

.test-attribute-selectors-flags[a="" i] {}
/*                                   ^ keyword.other.css */

   *.test-universal-selector {}
/* ^ entity.name.tag.wildcard.css */

.test-combinators >>> a >> a > a + b ~ a {}
/*                ^^^ punctuation.separator.combinator.css */
/*                      ^^ punctuation.separator.combinator.css */
/*                           ^ punctuation.separator.combinator.css */
/*                               ^ punctuation.separator.combinator.css */
/*                                   ^ punctuation.separator.combinator.css */

.test-invalid-combinators +>> a +++ a ~+> {}
/*                        ^^^ invalid.illegal.combinator.css */
/*                              ^^^ invalid.illegal.combinator.css */
/*                                    ^^^ invalid.illegal.combinator.css */

.test-generic-font-families {
    font: serif;
/*        ^^^^^ support.constant.font-name.css */
    font: sans-serif;
/*        ^^^^^^^^^^ support.constant.font-name.css */
    font: cursive;
/*        ^^^^^^^ support.constant.font-name.css */
    font: fantasy;
/*        ^^^^^^^ support.constant.font-name.css */
    font: monospace;
/*        ^^^^^^^^^ support.constant.font-name.css */
}

.test-unquoted-font-name {
    font: m700, aria;
/*        ^^^^ string.unquoted */
/*            ^ punctuation.separator */
/*            ^^ - string */
/*              ^^^^ string.unquoted */
    font: inherit;
/*        ^ - string */
    font: initial;
/*        ^ - string */
    font: unset;
/*        ^ - string */
    font: italic;
/*        ^ - string */
    font: small-caps;
/*        ^ - string */
    font: 2em m700, sans-serif;
/*        ^ - string */
/*            ^^^^ string.unquoted */
/*                ^ punctuation.separator */
/*                  ^ - string */
    font-weight: bold;
/*  ^^^^^^^^^^^ meta.property-name support.type.property-name */
}

.test-color-values {
    color: aqua;
/*         ^^^^ support.constant.color.w3c-standard-color-name.css */

    color: aliceblue;
/*         ^^^^^^^^^ support.constant.color.w3c-extended-color-keywords.css */

    color: currentColor;
/*         ^^^^^^^^^^^^ support.constant.color.w3c-special-color-keyword.css */

    color: transparent;
/*         ^^^^^^^^^^^ support.constant.color.w3c-special-color-keyword.css */

    color: #b4da55;
/*         ^ punctuation.definition.constant.css */
/*         ^^^^^^^ constant.other.color.rgb-value.css */

    color: #137;
/*         ^^^^ constant.other.color.rgb-value.css */

    color: #0f0a;
/*         ^^^^^ constant.other.color.rgba-value.css */

    color: #a1b2c3d4;
/*         ^^^^^^^^^ constant.other.color.rgba-value.css */

    color: #E5F6A7B8;
/*         ^ punctuation.definition.constant.css */
/*         ^^^^^^^^^ constant.other.color.rgba-value.css */
}

.test-function-meta {
    top: filter(param1, 20px);
/*       ^^^^^^^^^^^^^^^^^^^^ meta.function-call.css */
/*             ^^^^^^^^^^^^^^ meta.group.css */
}

.test-color-functions {
    top: rgb(1, 4.5%);
/*       ^^^ support.function.color.css */
/*           ^ constant.numeric.integer.decimal.css */
/*            ^ punctuation.separator.sequence.css */
/*              ^^^^ constant.numeric.float.decimal.css */

    top: rgba();
/*       ^^^^ support.function.color.css */

    top: hsl(1deg, 4.5%);
/*       ^^^ support.function.color.css */
/*           ^^^^ constant.numeric.integer.decimal.css */
/*               ^ punctuation.separator.sequence.css */
/*                 ^^^^ constant.numeric.float.decimal.css */

    top: hsla();
/*       ^^^^ support.function.color.css */

    top: hwb();
/*       ^^^ support.function.color.css */


    top: gray(1, 4.5%);
/*       ^^^^ support.function.color.css */
/*            ^ constant.numeric.integer.decimal.css */
/*             ^ punctuation.separator.sequence.css */
/*               ^^^^ constant.numeric.float.decimal.css */

    top: device-cmyk(0.5, 1%, red());
/*       ^^^^^^^^^^^ support.function.color.css */
/*                   ^^^ constant.numeric.float.decimal.css */
/*                      ^ punctuation.separator.sequence.css */
/*                        ^^ constant.numeric.integer.decimal.css */
/*                            ^^^ support.function.color.css */

    top: color(w() s());
/*       ^^^^^ support.function.color.css */
/*             ^ support.function.color.css */
/*                 ^ support.function.color.css */

    top: alpha(- 1.5%);
/*       ^^^^^ support.function.color.css */
/*             ^ keyword.operator.css */
/*               ^^^^ constant.numeric.float.decimal.css */

    top: h(+ 1.5deg);
/*       ^ support.function.color.css */
/*         ^ keyword.operator.css */
/*           ^^^^^^ constant.numeric.float.decimal.css */

    top: w(* 1.5%);
/*       ^ support.function.color.css */
/*         ^ keyword.operator.css */
/*           ^^^^ constant.numeric.float.decimal.css */

    top: shade(1.5%);
/*       ^^^^^ support.function.color.css */
/*             ^^^^ constant.numeric.float.decimal.css */

    top: blenda(red 50% hsl);
/*       ^^^^^^ support.function.color.css */
/*              ^^^ support.constant.color.w3c-standard-color-name.css */
/*                  ^^^ constant.numeric.integer.decimal.css */
/*                      ^^^ keyword.other.color-space.css */

    background-color: color(var(--background) blend(var(--foreground) 80%));
/*  ^^^^^^^^^^^^^^^^ support.type.property-name.css */
/*                  ^ punctuation.separator.key-value.css */
/*                    ^^^^^ support.function.color.css */
/*                         ^ punctuation.definition.group.begin.css */
/*                          ^^^ support.function.var.css */
/*                             ^ punctuation.definition.group.begin.css */
/*                              ^^^^^^^^^^^^ support.type.custom-property */
/*                                          ^ punctuation.definition.group.end.css */
/*                                            ^^^^^ support.function.color.css */
/*                                                 ^ punctuation.definition.group.begin.css */
/*                                                  ^^^ support.function.var.css */
/*                                                     ^ punctuation.definition.group.begin.css */
/*                                                      ^^^^^^^^^^^^ support.type.custom-property.css */
/*                                                                  ^ punctuation.definition.group.end.css */
/*                                                                    ^^^ constant.numeric.integer.decimal.css */
/*                                                                       ^^ punctuation.definition.group.end.css */
/*                                                                         ^ punctuation.terminator.rule.css */
}

.test-transform-functions {
    top: rotate(0);
/*       ^^^^^^ support.function.transform.css */
/*              ^ constant.numeric.integer.decimal.css */

    top: rotate(1)
/*       ^^^^^^ support.function.transform.css */
/*              ^ - constant.numeric.integer.decimal.css */

    top: rotate3d(-1, 2deg);
/*       ^^^^^^^^ support.function.transform.css */
/*                ^^ constant.numeric.integer.decimal.css */
/*                    ^^^^ constant.numeric.integer.decimal.css */

    top: matrix3d(1, 0);
/*       ^^^^^^^^ support.function.transform.css */
/*                ^ constant.numeric.integer.decimal.css */
/*                 ^ punctuation.separator.sequence.css */
/*                   ^ constant.numeric.integer.decimal.css */

    top: translate3d(1, 2px, 3%);
/*       ^^^^^^^^^^^ support.function.transform.css */
/*                   ^ constant.numeric.integer.decimal.css */
/*                    ^ punctuation.separator.sequence.css */
/*                      ^^^ constant.numeric.integer.decimal.css */
/*                           ^^ constant.numeric.integer.decimal.css */

    top: translateY(2px);
/*       ^^^^^^^^^^ support.function.transform.css */
/*                  ^^^ constant.numeric.integer.decimal.css */

    top: translateX(1%);
/*       ^^^^^^^^^^ support.function.transform */
/*                  ^^ constant.numeric.integer.decimal.css */

    top: translateZ(0);
/*       ^^^^^^^^^^ support.function.transform */
/*                  ^ constant.numeric.integer.decimal.css */

    top: skewY(1deg);
/*       ^^^^^ support.function.transform.css */
/*             ^^^^ constant.numeric.integer.decimal.css */

    top: skew(1deg, 2turn);
/*       ^^^^ support.function.transform.css */
/*            ^^^^ constant.numeric.integer.decimal.css */
/*                ^ punctuation.separator.sequence.css */
/*                  ^^^^^ constant.numeric.integer.decimal.css */

    top: perspective(17px);
/*       ^^^^^^^^^^^ support.function.transform.css */
/*                   ^^^^ constant.numeric.integer.decimal.css */

    top: scaleY(2);
/*       ^^^^^^ support.function.transform.css */
/*              ^ constant.numeric.integer.decimal.css */

    top: skewY(1rad) rotate(1turn);
/*                   ^^^^^^ support.function.transform.css */
/*                          ^^^^^ constant.numeric.integer.decimal.css */

    transform: translate(var(--center), 0) scale(var(--ripple-scale), 1);
/*             ^^^^^^^^^ support.function.transform */
/*                       ^^^ support.function.var */
/*                           ^^^^^^^^ support.type.custom-property */
/*                                      ^ constant.numeric */
/*                                               ^^^ support.function.var */
}

.test-timing-functions {
    top: cubic-bezier(0.42, 0, 0.58, 1);
/*       ^^^^^^^^^^^^ support.function.timing.css */
/*                    ^^^^ constant.numeric.float.decimal.css */

    top: steps(020, start);
/*       ^^^^^ support.function.timing.css */
/*             ^^^ constant.numeric.integer.decimal.css */
/*                  ^^^^^ support.keyword.timing-direction.css */

    top: steps(1, end);
/*                ^^^ support.keyword.timing-direction.css */

    top: steps(1, middle);
/*                ^^^^^^ support.keyword.timing-direction.css */
}

.test-shape-functions {
    top: circle(at top 5.5e20em);
/*       ^^^^^^ support.function.shape.css */
/*              ^^ keyword.other.css */
/*                 ^^^ support.constant.property-value.css */
/*                     ^^^^^^^^ constant.numeric.float.decimal.css */

    top: ellipse(at 0%);
/*       ^^^^^^^ support.function.shape.css */
/*               ^^ keyword.other.css */
/*                  ^^ constant.numeric.integer.decimal.css */

    top: ellipse(closest-side);
/*               ^^^^^^^^^^^^ support.constant.property-value.css */

    top: inset(1.1px round 50%);
/*       ^^^^^ support.function.shape.css */
/*             ^^^^^ constant.numeric.float.decimal.css */
/*                   ^^^^^ keyword.other.css */

    top: rect(auto);
/*       ^^^^ support.function.shape.css */
/*            ^^^^ support.constant.property-value.css */

    top: rect(1px);
/*            ^^^ constant.numeric.integer.decimal.css */
}

.test-calc-function {
    top: calc(1.1px + 2rad);
/*       ^^^^ support.function.calc.css */
/*            ^^^^^ constant.numeric.float.decimal.css */
/*                    ^^^^ constant.numeric.integer.decimal.css */

    top: calc(attr(start, 1) - 1);
    /*        ^^^^ support.function.attr.css */

    top: calc(calc() * calc());
/*       ^^^^ support.function.calc.css */
/*            ^^^^ support.function.calc.css */
/*                   ^ keyword.operator.css */
/*                     ^^^^ support.function.calc.css */
    top: calc(100% - (1 * 10px) / 1 - (1 * 10px) / 1 - (1 * 10px) / 1);
/*       ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.function-call.css */
/*       ^^^^ support.function.calc.css */
/*           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.group.css */
/*           ^ punctuation.definition.group.begin.css */
/*            ^^^ constant.numeric.integer.decimal.css */
/*                 ^ keyword.operator.css */
/*                   ^ punctuation.definition.group.begin.css */
/*                   ^^^^^^^^^^ meta.group.css meta.group.css */
/*                            ^ punctuation.definition.group.end.css */
/*                              ^ keyword.operator.css */
/*                                    ^ punctuation.definition.group.begin.css */
/*                                         ^^ constant.numeric.integer.decimal.css */
/*                                           ^^ keyword.other.unit.css */
/*                                             ^ punctuation.definition.group.end.css */
/*                                               ^ keyword.operator.css */
/*                                                   ^ keyword.operator.css */
/*                                                     ^ punctuation.definition.group.begin.css */
/*                                                      ^ constant.numeric.integer.decimal.css */
/*                                                        ^ keyword.operator.css */
/*                                                          ^^ constant.numeric.integer.decimal.css */
/*                                                              ^ punctuation.definition.group.end.css */
/*                                                                ^ keyword.operator.css */
/*                                                                  ^ constant.numeric.integer.decimal.css */
/*                                                                   ^ punctuation.definition.group.end.css */
/*                                                                    ^ punctuation.terminator.rule.css - meta.group */
}

.test-toggle-function {
    top: toggle(5px red preserve-3d);
/*       ^^^^^^ support.function.toggle.css */
/*              ^^^ constant.numeric.integer.decimal.css */
/*                  ^^^ support.constant.color.w3c-standard-color-name.css */
/*                      ^^^^^^^^^^^ support.constant.property-value.css */
}

.test-attr-function {
    top: attr(*|c);
/*       ^^^^ support.function.attr.css */
/*            ^ entity.name.namespace.wildcard.css */
/*             ^ punctuation.separator.namespace.css */
/*              ^ entity.other.attribute-name.css */

    top: attr(n|size);
/*            ^ entity.other.namespace-prefix.css */
/*              ^^^^ entity.other.attribute-name.css */

    top: attr(size px, auto);
/*            ^^^^ entity.other.attribute-name.css */
/*                 ^^ keyword.other.unit.css */
/*                   ^ punctuation.separator.sequence.css */
/*                     ^^^^ support.constant.property-value.css */

    top: attr(preserve-3d);
/*            ^^^^^^^^^^^ entity.other.attribute-name.css */
}

.test-url-function {
    top: url("a");
/*       ^^^ support.function.url.css */
/*           ^^^ string.quoted.double.css */

    top: url(a);
/*           ^ string.unquoted.css */
}

.test-image-functions {
    top: image("a");
/*       ^^^^^ support.function.image.css */
/*             ^^^ string.quoted.double.css */

    top: image(a);
/*             ^ string.unquoted.css */

    top: image("a", rgb(0, 0, 0));
/*                ^ punctuation.separator.sequence.css */
/*                      ^ constant.numeric.integer.decimal.css */

    top: image-set("a" 1x, a 4dpi);
/*                 ^^^ string.quoted.double.css */
/*                     ^^ constant.numeric.integer.decimal.css */
/*                      ^ keyword.other.unit.css */
/*                       ^ punctuation.separator.sequence.css */
/*                         ^ string.unquoted.css */
/*                           ^^^^ constant.numeric.integer.decimal.css */

    top: cross-fade(50% "a", b);
/*       ^^^^^^^^^^ support.function.image.css */
/*                  ^^^ constant.numeric.integer.decimal.css */
/*                      ^^^ string.quoted.double.css */
/*                         ^ punctuation.separator.sequence.css */
/*                           ^ string.unquoted.css */
}

.test-gradient-functions {
    top: linear-gradient();
/*       ^^^^^^^^^^^^^^^ support.function.gradient.css */

    top: linear-gradient(45deg, white);
/*                       ^^^^^ constant.numeric.integer.decimal.css */
/*                            ^ punctuation.separator.sequence.css */
/*                              ^^^^^ support.constant.color.w3c-standard-color-name.css */

    top: linear-gradient(to top left);
/*                       ^^ keyword.other.css */
/*                          ^^^ support.constant.property-value.css */
/*                              ^^^^ support.constant.property-value.css */

    top: linear-gradient(0%, 100%);
/*                       ^^ constant.numeric.integer.decimal.css */
/*                           ^^^^ constant.numeric.integer.decimal.css */

    top: repeating-linear-gradient();
/*       ^^^^^^^^^^^^^^^^^^^^^^^^^ support.function.gradient.css */

    top: radial-gradient();
/*       ^^^^^^^^^^^^^^^ support.function.gradient.css */

    top: radial-gradient(circle at top left);
/*                       ^^^^^^ keyword.other.css */
/*                              ^^ keyword.other.css */
/*                                 ^^^ support.constant.property-value.css */
/*                                     ^^^^ support.constant.property-value.css */

    top: radial-gradient(red, blue);
/*                       ^^^ support.constant.color.w3c-standard-color-name.css */
/*                          ^ punctuation.separator.sequence.css */

    top: repeating-radial-gradient();
/*       ^^^^^^^^^^^^^^^^^^^^^^^^^ support.function.gradient.css */
}

.test-counter-functions {
    top: counter(name, decimal-leading-zero);
/*       ^^^^^^^ support.function.counter.css */
/*               ^^^^ entity.other.counter-name.css string.unquoted.css */
/*                   ^ punctuation.separator.sequence.css */
/*                     ^^^^^^^^^^^^^^^^^^^^ support.constant.property-value.counter-style.css */

    top: counters(name, "str", none);
/*       ^^^^^^^^ support.function.counter.css */
/*                ^^^^ entity.other.counter-name.css string.unquoted.css */
/*                    ^ punctuation.separator.sequence.css */
/*                      ^^^^^ string.quoted.double.css */
/*                           ^ punctuation.separator.sequence.css */
/*                             ^^^^ support.constant.property-value.counter-style.css */

    top: symbols(fixed "\2020" url());
/*       ^^^^^^^ support.function.counter.css */
/*               ^^^^^ support.constant.symbol-type.css */
/*                     ^^^^^^^ string.quoted.double.css */
/*                             ^^^ support.function.url.css */
}

.test-grid-functions {
    grid: repeat(20) / auto-flow 1fr;
/*        ^^^^^^ support.function.grid.css */
/*               ^^ constant.numeric.integer.decimal.css */
/*                     ^^^^^^^^^ support.constant.property-value.css */

    top: repeat(auto-fit, 2fr minmax(auto) 5%);
/*              ^^^^^^^^ support.keyword.repetitions.css */
/*                      ^ punctuation.separator.sequence.css */
/*                        ^^^ constant.numeric.integer.decimal.css */
/*                            ^^^^^^ support.function.grid.css */
/*                                   ^^^^ support.constant.property-value.css */
/*                                         ^^ constant.numeric.integer.decimal.css */

    top: minmax(min-content, 1fr, 10%);
/*       ^^^^^^ support.function.grid.css */
/*              ^^^^^^^^^^^ support.constant.property-value.css */
/*                         ^ punctuation.separator.sequence.css */
/*                           ^^^ constant.numeric.integer.decimal.css */
/*                                ^^^ constant.numeric.integer.decimal.css */
    grid-template: repeat(2, var(--size)) / repeat(2, 50%);
/*                           ^^^ support.function.var.css */
/*                               ^^^^^^ support.type.custom-property.css */
/*                                     ^^ punctuation.definition.group.end.css */
/*                                          ^^^^^^ support.function.grid.css */
    grid-template-columns:
      [a-line-name] auto
/*    ^ punctuation.section.begin.css */
/*     ^^^^^^^^^^^ string.unquoted.line-name.css */
/*                ^ punctuation.section.end.css */
      [b]     minmax(min-content, 1fr)
      [b c d] repeat(2, [e] 40px)
/*    ^ punctuation.section.begin.css */
/*     ^ string.unquoted.line-name.css */
/*      ^ - string.unquoted.line-name.css */
/*       ^ string.unquoted.line-name.css */
/*          ^ punctuation.section.end.css */
/*                      ^ punctuation.section.begin.css */
/*                       ^ string.unquoted.line-name.css */
/*                        ^ punctuation.section.end.css */
              repeat(5, auto);
}

.test-filter-functions {
    top: filter(url(), blur());
/*       ^^^^^^ support.function.filter.css */
/*              ^^^ support.function.url.css */
/*                     ^^^^ support.function.filter.css */

    top: blur(1px);
/*       ^^^^ support.function.filter.css */

    top: sepia(1% 1);
/*       ^^^^^ support.function.filter.css */
/*             ^^ constant.numeric.integer.decimal.css */
/*                ^ constant.numeric.integer.decimal.css */

    top: drop-shadow(1px rgb());
/*       ^^^^^^^^^^^ support.function.filter.css */
/*                   ^^^ constant.numeric.integer.decimal.css */
/*                       ^^^ support.function.color.css */

    top: hue-rotate(1turn);
/*       ^^^^^^^^^^ support.function.filter.css */
/*                  ^^^^^ constant.numeric.integer.decimal.css */
}

/* Test Font Functions: format() & local() */
@font-face {
  src: format("embedded-opentype");
/*     ^^^^^^ support.function.font-face.css */
/*            ^^^^^^^^^^^^^^^^^^^ string.quoted.double.css */

  src: local(Gentium-Bold);
/*     ^^^^^ support.function.font-face.css */
/*           ^^^^^^^^^^^^ string.unquoted.css */

  src: local('Gentium-Bold');
/*     ^^^^^ support.function.font-face.css */
/*           ^^^^^^^^^^^^^^ string.quoted.single.css */
/*           ^ punctuation.definition.string.begin.css */
/*                        ^ punctuation.definition.string.end.css */

  src: local("Gentium-Bold");
/*     ^^^^^ support.function.font-face.css */
/*           ^^^^^^^^^^^^^^ string.quoted.double.css */
/*           ^ punctuation.definition.string.begin.css */
/*                        ^ punctuation.definition.string.end.css */
}

@font-face {
    font-family: m700, aria;
/*               ^^^^ string.unquoted.css */
/*                     ^^^^ string.unquoted.css */
}

.test-var-function {
    top: var(--name);
/*       ^^^ support.function.var.css */
/*           ^^ punctuation.definition.custom-property.css */
/*             ^^^^ support.type.custom-property.name.css */
}

.test-custom-tags > div > span + cust·m-tÀg > div-cøstom-tag ~ form-Çust😀m-tag.classname:last-child:hover {}
/*                ^ -entity.name.tag.custom.css */
/*                  ^^^ entity.name.tag.css */
/*                        ^^^^ entity.name.tag.css */
/*                             ^ -entity.name.tag.custom.css */
/*                               ^^^^^^^^^^ entity.name.tag.custom.css */
/*                                            ^^^^^^^^^^^^^^ entity.name.tag.custom.css */
/*                                                           ^ -entity.name.tag.custom.css */
/*                                                             ^^^^^^^^^^^^^^^ entity.name.tag.custom.css */
/*                                                                             ^^^^^^^^^ entity.other.attribute-name.class.css */
/*                                                                                       ^^^^^^^^^^ -entity.name.tag.custom.css */
/*                                                                                                  ^^^^^ -entity.name.tag.custom.css */

.test-property-name-order-doesnt-prevent-full-matches {
    grid-template-rows: none;
/*  ^^^^^^^^^^^^^^^^^^ support.type.property-name */
/*                    ^ punctuation.separator.key-value */
    grid-template-columns: none;
/*  ^^^^^^^^^^^^^^^^^^^^^ support.type.property-name */
/*                       ^ punctuation.separator.key-value */
    grid-template-areas: auto;
/*  ^^^^^^^^^^^^^^^^^^^ support.type.property-name */
/*                     ^ punctuation.separator.key-value */
    grid-template: initial;
/*  ^^^^^^^^^^^^^ support.type.property-name */
/*               ^ punctuation.separator.key-value */
    grid-row-gap: 3vmin;
/*  ^^^^^^^^^^^^ support.type.property-name */
/*              ^ punctuation.separator.key-value */
    grid-row: auto;
/*  ^^^^^^^^ support.type.property-name */
/*          ^ punctuation.separator.key-value */
}

.test-meta-scopes-for-completions {
    top: 5px;
/*^^^^^^^^^^^ meta.property-list */
/*  ^^^ meta.property-name */
/*      ^^^^ meta.property-value */
    top: ;
/*^^^^^^^^^^^ meta.property-list */
/*  ^^^ meta.property-name */
/*      ^ meta.property-value */
    top:
/*^^^^^^^ meta.property-list */
/*  ^^^ meta.property-name */
}/*     ^ meta.property-value */

.generic-font-family { font-family: my-serif, serif }
/*                                  ^^^^^^^^ string.unquoted */
/*                                          ^ - string */
/*                                            ^^^^^ support.constant.font-name */
.generic-font-family2 { font-family: sans-serif , fantasy , system-ui; }
/*                                   ^^^^^^^^^^ support.constant.font-name */
/*                                                ^^^^^^^ support.constant.font-name */
/*                                                          ^^^^^^^^^ support.constant.font-name */
.generic-font-family3 {
    font-family: cursive
/*               ^^^^^^^ support.constant.font-name */
}
.generic-font-family4 {
    font-family: droid serif;
/*               ^^^^^^^^^^^ string.unquoted */
}

a {
  height:calc(10px/*);
  font-family:"a*/);
/* ^^^^^^^^^^^^^^^ comment.block.css */
/*                ^ punctuation.definition.group.end.css */
}

.variable-beginnings {
    --1x: url(data:image/png;base64,PNG);
/*  ^^^^ support.type.custom-property */
/*  ^^ punctuation.definition.custom-property */
/*    ^^ support.type.custom-property.name */
/*      ^ punctuation.separator.key-value */
    background-image: var(--1x);
/*                        ^^^^ support.type.custom-property */
/*                        ^^ punctuation.definition.custom-property */
/*                          ^^ support.type.custom-property.name */
    --\ff: 5px;
/*  ^^^^^ support.type.custom-property */
/*  ^^ punctuation.definition.custom-property */
/*    ^^^ support.type.custom-property.name */
/*       ^ punctuation.separator.key-value */
}

img{
  clip-path: polygon(
    0% 0%,
    100% 0%,
    100% calc(100% - 31px),
/*       ^^^^ support.function.calc */
/*            ^^^ constant.numeric */
/*                        ^ punctuation.separator.sequence */
    calc(100% - 196px) calc(100% - 31px),
    calc(100% - 196px) 100%,
    0% 100%
  ) !important;
/*^ punctuation.definition.group.end */
/*  ^^^^^^^^^^ keyword.other.important */
}