* { box-sizing: border-box; }
body { margin: 0; background: #020014; overflow-x: hidden; font-family: sans-serif; max-width: 100vw; -webkit-text-size-adjust: 100%; overscroll-behavior-y: none;}
        ::-webkit-scrollbar { display: none; }
        * { -ms-overflow-style: none; scrollbar-width: none; }
        .scroll-track { position: relative; width: 100%; height: 900vh; }
        @media (max-width: 768px) { .scroll-track { height: 900vh; } }
        @media (max-width: 480px) { .scroll-track { height: 900vh; } }
        .sticky-container { position: sticky; top: 0; height: 100vh; width: 100vw; display: flex; justify-content: center; align-items: center; overflow: hidden; background: #020014; }
canvas { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transform-origin: center center; z-index: 1; }
#text-overlay-container { position: absolute; inset: 0; pointer-events: none; overflow: hidden; z-index: 10; width: 100%; height: 100%; perspective: 1000px;}

/* Force GPU Hardware Acceleration for Glassmorphism */
[style*="backdrop-filter"], [style*="blur"] {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    will-change: backdrop-filter, transform;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}


        #loader { position: fixed; inset: 0; background: #111; color: white; display: flex; justify-content: center; align-items: center; flex-direction: column; z-index: 9999; transition: opacity 0.5s; font-family: sans-serif; }
        #loader-bar { width: 200px; height: 4px; background: #333; margin-top: 15px; border-radius: 2px; overflow: hidden; }
        #loader-fill { height: 100%; background: #3b82f6; width: 0%; }