/* ========================================================================== main.css — Entry Stylesheet WerqLabs — imports the full modular CSS system in cascade order. Load order matters (ITCSS-inspired, low → high specificity): 1. variables → design tokens 2. reset → normalize 3. typography → base type 4. layout → structural primitives 5. components → UI components 6. utilities → atomic overrides (highest practical specificity) 7. animations → motion + reveal Usage in (single request preferred after minification): For best First Contentful Paint, inline critical CSS from variables + reset + typography, then load the rest deferred. ========================================================================== */ @import url("variables.css"); @import url("reset.css"); @import url("typography.css"); @import url("layout.css"); @import url("components.css"); @import url("utilities.css"); @import url("animations.css"); /* ── Base page defaults ───────────────────────────────────────────────── */ ::selection { background: var(--color-brand); color: var(--color-white); } ::-webkit-scrollbar { inline-size: 12px; block-size: 12px; } ::-webkit-scrollbar-track { background: var(--color-surface-alt); } ::-webkit-scrollbar-thumb { background: var(--color-graphite-300); border-radius: var(--radius-pill); border: 3px solid var(--color-surface-alt); } ::-webkit-scrollbar-thumb:hover { background: var(--color-graphite); }