::view-transition,
::view-transition-group(*),
div {
    background: red;
    inset: 0;
    position: absolute;
    transform: none !important;
}

html.no-match::view-transition {
    background: green;
}

.green {
    view-transition-name: green;
}

.test {
    view-transition-name: test;
}

.green-ref {
    view-transition-group: green;
}

.red {
    view-transition-name: red;
}

.test-ref {
    view-transition-group: test;
}

.red-ref {
    view-transition-group: red;
}

.nearest-ref {
    view-transition-group: nearest;
}

.normal {
    view-transition-name: normal;
}

.normal-ref {
    view-transition-group: normal;
}

.contain-ref {
    view-transition-group: contain;
}

::view-transition-group(*) {
    animation-play-state: paused;
}
::view-transition-group(green) {
    background: green;
}
::view-transition-group-children(*) {
  background: inherit;
}
::view-transition-group(test) {
    background: inherit;
}
::view-transition-image-pair(*),
::view-transition-old(*),
::view-transition-new(*)
 {
    display: none;
}
