/* Base CSS - Prevents layout shifts during page load */

:root {
    --topbar-height: 56px;
}

/* Reset and base styles */
* {
    box-sizing: border-box;
}

html {
    /* Prevent horizontal scrollbar from causing layout shift */
    overflow-x: hidden;
}

body {
    /* Prevent layout shift from margin collapse */
    margin: 0;
    
    /* Prevent horizontal scrollbar */
    overflow-x: hidden;
    
    /* Prevent font loading shift */
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}

/* Reserve space for topbar web component before it loads */
top-bar {
    display: block;
    height: var(--topbar-height);
    /* Prevent any margin collapse */
    margin: 0;
}

/* Prevent images from causing layout shift */
img {
    /* Reserve space even before image loads */
    display: block;
    max-width: 100%;
    height: auto;
}