A basic structure for a Layer based CSS file

styles.css

@layer reset, framework, customframework, components, utilities;

@layer reset {
    * {
        box-sizing: border-box;
    }
}

@import url('framework.css') layer(framework);

@layer customframework {
    /* Our Own Custom Framework styles */
}

@layer components {
    .button {
        padding: 1rem;
    }
}

@layer utilities {
    .text-center { text-align: center; }
}