body {
            font-family: 'Inter', sans-serif;
            background-color: #000;
            color: #fff;
            scroll-behavior: smooth;
            position: relative;
            overflow-x: hidden;
        }

        .font-brutal {
            font-family: 'Unbounded', sans-serif;
            text-transform: uppercase;
            letter-spacing: -0.05em;
        }

        .brutalist-border {
            border: 3px solid #fff;
        }

        .brutalist-shadow {
            box-shadow: 8px 8px 0px 0px #fff;
        }

        .brutalist-shadow-hover:hover {
            box-shadow: 4px 4px 0px 0px #fff;
            transform: translate(4px, 4px);
        }

        .brutalist-shadow-accent {
            box-shadow: 8px 8px 0px 0px #a855f7;
        }

        .accent-text {
            color: #a855f7;
        }

        .bg-accent {
            background-color: #a855f7;
        }

        .border-accent {
            border-color: #a855f7;
        }

        ::-moz-selection {
            background-color: #a855f7;
            color: #fff;
        }

        ::selection {
            background-color: #a855f7;
            color: #fff;
        }

        .noise {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            pointer-events: none;
            z-index: 9999;
            opacity: 0.08;
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
        }

        .glitch {
            position: relative;
            display: block;
            color: #fff;
        }

        .glitch::before,
        .glitch::after {
            content: attr(data-text);
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: transparent;
            pointer-events: none;
        }

        .glitch::before {
            left: 1.5px;
            text-shadow: -1.5px 0 #ff00c1;
            clip-path: inset(0 0 0 0);
            animation: glitch-anim 3s infinite linear alternate-reverse;
            opacity: 0.6;
        }

        .glitch::after {
            left: -1.5px;
            text-shadow: -1.5px 0 #00fff9, 1.5px 1.5px #ff00c1;
            clip-path: inset(0 0 0 0);
            animation: glitch-anim2 0.7s infinite linear alternate-reverse;
            opacity: 0.6;
        }

        @keyframes glitch-anim {
            0% { clip-path: inset(15% 0 45% 0); transform: translate(-1px, -1px); }
            10% { clip-path: inset(70% 0 5% 0); transform: translate(1px, 1px); }
            20% { clip-path: inset(5% 0 80% 0); transform: translate(-1px, 0px); }
            30% { clip-path: inset(55% 0 25% 0); transform: translate(1px, -1px); }
            40% { clip-path: inset(90% 0 0% 0); transform: translate(-1px, 1px); }
            50% { clip-path: inset(0% 0 100% 0); transform: translate(0px, -1px); }
            60% { clip-path: inset(45% 0 35% 0); transform: translate(1px, 1px); }
            70% { clip-path: inset(85% 0 10% 0); transform: translate(-1px, -1px); }
            80% { clip-path: inset(10% 0 85% 0); transform: translate(1px, 0px); }
            90% { clip-path: inset(40% 0 30% 0); transform: translate(-1px, 1px); }
            100% { clip-path: inset(30% 0 60% 0); transform: translate(0px, -1px); }
        }

        @keyframes glitch-anim2 {
            0% { clip-path: inset(0% 0 95% 0); transform: translate(0.5px, 0.5px); }
            20% { clip-path: inset(90% 0 0% 0); transform: translate(-0.5px, -0.5px); }
            40% { clip-path: inset(40% 0 50% 0); transform: translate(0.5px, -0.5px); }
            60% { clip-path: inset(65% 0 20% 0); transform: translate(-0.5px, 0.5px); }
            80% { clip-path: inset(25% 0 70% 0); transform: translate(0.5px, 0.5px); }
            100% { clip-path: inset(50% 0 40% 0); transform: translate(-0.5px, -0.5px); }
        }

        @keyframes loading-progress {
            0% { transform: scaleX(0); }
            20% { transform: scaleX(0.2); }
            40% { transform: scaleX(0.15); }
            60% { transform: scaleX(0.7); }
            85% { transform: scaleX(0.95); }
            100% { transform: scaleX(1); }
        }

        .animate-loading-progress {
            animation: loading-progress 3s infinite cubic-bezier(0.65, 0, 0.35, 1);
        }