결과

css 작성 시,
하나의 클래스가 다양한 layer에서 쓰이는 경우, layer우선 순위에 따라 클래스의 스타일이 적용된다.

예시

/* css상단에 선언 ( 뒤로갈수록 우선순위 높음 ) */
@layer reset, base, component;

@layer reset {
    body {
        background-color: white; /* 우선순위 4 */
    }
}

@layer base {
    body {
        background-color: yellow; /* 우선순위 3 */
    }
}

@layer component {
    body {
        background-color: #ebebeb; /* 우선순위 2 */
    }
}

body {
    background-color: red; /* 우선순위 1 */
}

적용 브라우저

https://caniuse.com/?search=%40layer