.gradient-tag {
    background: linear-gradient(
        90deg,
        #3b82f6,
        #60a5fa,
        #21c4c4,
        #60a5fa,
        #3b82f6
    );
    background-size: 300% 100%;
    animation: gradientShift 4s linear infinite, glowPulse 2.5s ease-in-out infinite;

    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;

    font-weight: 700;
}

@keyframes gradientShift {
    0%   { background-position: 0% 50%; }
    100% { background-position: 300% 50%; }
}

@keyframes glowPulse {
    0% {
        text-shadow:
            0 0 4px rgba(59,130,246,0.2),
            0 0 8px rgba(59,130,246,0.15),
            0 0 12px rgba(34,197,94,0.2);
    }
    50% {
        text-shadow:
            0 0 8px rgba(59,130,246,0.4),
            0 0 16px rgba(59,130,246,0.3),
            0 0 24px rgba(34,197,94,0.25);
    }
    100% {
        text-shadow:
            0 0 4px rgba(59,130,246,0.2),
            0 0 8px rgba(59,130,246,0.15),
            0 0 12px rgba(34,197,94,0.15);
    }
}

.white-1e1d7 .notation-322f9 {
    color: #475569 !important;
    font-weight: bold !important;
}

.black-3c85d .notation-322f9 {
    color: #cbd5e1 !important;
    font-weight: bold !important;
}

.dark .white-1e1d7 {
    background-color: #cbd5e1;
}

.dark .black-3c85d {
    background-color: #475569;
}

.custom-scroll::-webkit-scrollbar {
    width: 6px;
}

.custom-scroll::-webkit-scrollbar-track {
    background: transparent;
}

.custom-scroll::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}

.dark .custom-scroll::-webkit-scrollbar-thumb {
    background: #475569;
}