/* Animation Keyframes */
        @keyframes fillBar {
            from {
                width: 0%;
            }

            to {
                width: var(--target-width);
            }
        }

        @keyframes shimmer {
            0% {
                transform: skewX(-20deg) translateX(-150%);
            }

            100% {
                transform: skewX(-20deg) translateX(250%);
            }
        }

        /* Classes for the bars */
        .skill-bar-container {
            position: relative;
            overflow: hidden;
        }

        .skill-fill {
            width: 0%;
            animation: fillBar 1.5s cubic-bezier(0.22, 1, 0.36, 1) forwards;
            position: relative;
        }

        /* The shiny effect overlay */
        .skill-fill::after {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            background: linear-gradient(90deg,
                    rgba(255, 255, 255, 0) 0%,
                    rgba(255, 255, 255, 0.3) 50%,
                    rgba(255, 255, 255, 0) 100%);
            transform: skewX(-20deg) translateX(-150%);
            animation: shimmer 2.5s infinite;
        }