/* NitroPack Compatibility Fixes for Lock Wheel Animation */

/* Force GPU acceleration and prevent optimization interference */
.lock-wheel-container {
    will-change: transform !important;
    backface-visibility: hidden !important;
    perspective: 1000px !important;
    transform: translateZ(0) !important;
    -webkit-transform: translateZ(0) !important;
    -moz-transform: translateZ(0) !important;
    -ms-transform: translateZ(0) !important;
    -o-transform: translateZ(0) !important;
}

/* Ensure animations aren't stripped by optimization */
.lock-wheel-track {
    animation: rollCombinationLock 14s linear infinite !important;
    -webkit-animation: rollCombinationLock 14s linear infinite !important;
    -moz-animation: rollCombinationLock 14s linear infinite !important;
    -o-animation: rollCombinationLock 14s linear infinite !important;
}

/* Force individual item animations */
.dynamic-analysis-item:nth-child(1),
.dynamic-analysis-item:nth-child(8) {
    animation: highlight-item-1 14s linear infinite !important;
    -webkit-animation: highlight-item-1 14s linear infinite !important;
}

.dynamic-analysis-item:nth-child(2),
.dynamic-analysis-item:nth-child(9) {
    animation: highlight-item-2 14s linear infinite !important;
    -webkit-animation: highlight-item-2 14s linear infinite !important;
}

.dynamic-analysis-item:nth-child(3),
.dynamic-analysis-item:nth-child(10) {
    animation: highlight-item-3 14s linear infinite !important;
    -webkit-animation: highlight-item-3 14s linear infinite !important;
}

.dynamic-analysis-item:nth-child(4),
.dynamic-analysis-item:nth-child(11) {
    animation: highlight-item-4 14s linear infinite !important;
    -webkit-animation: highlight-item-4 14s linear infinite !important;
}

.dynamic-analysis-item:nth-child(5),
.dynamic-analysis-item:nth-child(12) {
    animation: highlight-item-5 14s linear infinite !important;
    -webkit-animation: highlight-item-5 14s linear infinite !important;
}

.dynamic-analysis-item:nth-child(6),
.dynamic-analysis-item:nth-child(13) {
    animation: highlight-item-6 14s linear infinite !important;
    -webkit-animation: highlight-item-6 14s linear infinite !important;
}

.dynamic-analysis-item:nth-child(7),
.dynamic-analysis-item:nth-child(14) {
    animation: highlight-item-7 14s linear infinite !important;
    -webkit-animation: highlight-item-7 14s linear infinite !important;
}

/* Keyframes duplicated here so they survive Remove Unused CSS / optimization */
@keyframes rollCombinationLock {

    0%,
    11.28% {
        transform: translateY(0px);
    }

    14.28%,
    25.56% {
        transform: translateY(-44px);
    }

    28.56%,
    39.84% {
        transform: translateY(-88px);
    }

    42.84%,
    54.12% {
        transform: translateY(-132px);
    }

    57.12%,
    68.40% {
        transform: translateY(-176px);
    }

    71.40%,
    82.68% {
        transform: translateY(-220px);
    }

    85.68%,
    96.96% {
        transform: translateY(-264px);
    }

    99.99% {
        transform: translateY(-308px);
    }

    100% {
        transform: translateY(0px);
    }
}

@keyframes highlight-item-1 {

    57.12%,
    68.40% {
        color: #E11D48;
        font-weight: 600;
        opacity: 1;
    }

    0%,
    54.12%,
    71.40%,
    100% {
        color: #64748B;
        font-weight: 500;
        opacity: 0.5;
    }
}

@keyframes highlight-item-2 {

    71.40%,
    82.68% {
        color: #E11D48;
        font-weight: 600;
        opacity: 1;
    }

    0%,
    68.40%,
    85.68%,
    100% {
        color: #64748B;
        font-weight: 500;
        opacity: 0.5;
    }
}

@keyframes highlight-item-3 {

    85.68%,
    96.96% {
        color: #E11D48;
        font-weight: 600;
        opacity: 1;
    }

    0%,
    82.68%,
    100% {
        color: #64748B;
        font-weight: 500;
        opacity: 0.5;
        background-color: transparent;
    }
}

@keyframes highlight-item-4 {

    0%,
    11.28%,
    99.99%,
    100% {
        color: #E11D48;
        font-weight: 600;
        opacity: 1;
    }

    14.28%,
    96.96% {
        color: #64748B;
        font-weight: 500;
        opacity: 0.5;
        background-color: transparent;
    }
}

@keyframes highlight-item-5 {

    14.28%,
    25.56% {
        color: #E11D48;
        font-weight: 600;
        opacity: 1;
    }

    0%,
    11.28%,
    28.56%,
    100% {
        color: #64748B;
        font-weight: 500;
        opacity: 0.5;
        background-color: transparent;
    }
}

@keyframes highlight-item-6 {

    28.56%,
    39.84% {
        color: #E11D48;
        font-weight: 600;
        opacity: 1;
    }

    0%,
    25.56%,
    42.84%,
    100% {
        color: #64748B;
        font-weight: 500;
        opacity: 0.5;
        background-color: transparent;
    }
}

@keyframes highlight-item-7 {

    42.84%,
    54.12% {
        color: #E11D48;
        font-weight: 600;
        opacity: 1;
    }

    0%,
    39.84%,
    57.12%,
    100% {
        color: #64748B;
        font-weight: 500;
        opacity: 0.5;
        background-color: transparent;
    }
}

/* NitroPack bypass - force critical CSS */
@media screen {

    .lock-wheel-container,
    .lock-wheel-track,
    .dynamic-analysis-item {
        animation-play-state: running !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
}