/* Bernard 5.2 — next level visibly turns fully on and off every two seconds */
#bernard .progress-panel .level-segment.current {
    animation: none !important;
}

#bernard .progress-panel .level-segment.next-level {
    animation: bernard-next-level-full-pulse 2s ease-in-out infinite !important;
    will-change: opacity, background-color, box-shadow, filter !important;
}

@keyframes bernard-next-level-full-pulse {
    0%, 100% {
        opacity: .08;
        height: 2px;
        background-color: rgba(80, 80, 80, .18);
        box-shadow: none;
        filter: brightness(.15);
    }
    50% {
        opacity: 1;
        height: 4px;
        background-color: #fff;
        box-shadow:
            0 0 8px #fff,
            0 0 18px rgba(255,255,255,1),
            0 0 34px rgba(255,255,255,.95),
            0 0 54px rgba(255,255,255,.70);
        filter: brightness(2);
    }
}

/* The failed current level replaces white with red. */
#bernard .progress-panel .level-segment.failed-level,
#bernard .progress-panel .level-segment.failed-level.complete,
#bernard .progress-panel .level-segment.failed-level.current {
    height: 4px !important;
    opacity: 1 !important;
    background: #d71920 !important;
    box-shadow:
        0 0 8px rgba(215,25,32,1),
        0 0 18px rgba(215,25,32,.92),
        0 0 34px rgba(215,25,32,.62) !important;
    filter: brightness(1.12) !important;
    animation: none !important;
}