.fight-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 9998;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.fight-overlay.active {
    display: flex;
    opacity: 1;
    pointer-events: all;
}

.fight-content {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.boss-warning {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: clamp(48px, 8vw, 80px);
    color: #ffaa00;
    -webkit-text-stroke: 2px black;
    opacity: 1;
    transition: opacity 0.3s ease, transform 0.3s ease;
    text-align: center;
    white-space: nowrap;
    user-select: none;
}

.boss-warning.blink {
    animation: warningBlink 0.5s infinite;
}

@keyframes warningBlink {

    0%,
    100% {
        opacity: 1;
    }

    50% {
        opacity: 0.5;
    }
}

.fight-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(3);
    font-family: 'Rye', sans-serif;
    font-size: clamp(48px,
            8vw,
            80px);
    color: rgb(207, 47, 47);
    -webkit-text-stroke: 2px black;
    text-align: center;
    white-space: nowrap;
    user-select: none;
    opacity: 0;
    transition: none;
}

.fight-overlay.active .fight-text.visible {
    opacity: 1 !important;
    transform: translate(-50%, -50%) scale(1) !important;
    transition: transform 0.3s, opacity 0.3s ease !important;
}

@media (max-width: 480px) {
    .fight-text {
        font-size: 50px !important;
    }

    .boss-warning {
        font-size: 20px;
    }
}

@media (max-width: 854px) {
    .fight-overlay {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
    }

    .fight-text {
        font-size: 40px !important;
    }

    .boss-warning {
        font-size: 32px !important;
    }
}

@media (max-width: 600px) {
    .fight-text {
        font-size: 32px !important;
    }

    .boss-warning {
        font-size: 24px !important;
    }
}