body {
    margin: 0;
    height: 100vh;
    overflow: hidden;
    position: relative;
    user-select: none;
}

@font-face {
    font-family: "Stratum2";
    src: url("/assets/fonts/stratumno2_regular.otf") format("opentype");
    font-weight: normal;
    font-style: normal;
}

/* Фон-вихрь */
.rainbow-bg {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 200vmax;
    height: 200vmax;
    transform: translate(-50%, -50%);
    background: conic-gradient(
        red, orange, yellow, rgb(58, 230, 58), cyan, blue, rgb(255, 38, 255), red
    );
    animation: spin 40s linear infinite;
    z-index: -1;
}

.death-text {
    position: absolute;
    font-family: "Stratum2", sans-serif;
    font-size: 22px;
    font-weight: 700;
    color: white;

    /* Тёмная обводка */
    -webkit-text-stroke: 2px #222;
    paint-order: stroke fill;

    /* Дополнительная тень */
    text-shadow:
        0 0 2px #222,
        0 0 4px #222;

    pointer-events: none;
    transform: translate(-50%, -50%);
    animation: deathFloat 1s ease-out forwards;
}


@keyframes deathFloat {
    0% {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }
    100% {
        opacity: 0;
        transform: translate(-50%, -120%) scale(1.2);
    }
}

#enemy-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: auto;
    
}

.enemy {
    --dir: 1;
    transform: scaleX(var(--dir));

    transform-origin: center;
    position: absolute;
    pointer-events: auto;
    transition: none;
}

.enemy-death {
    animation: enemyDeath 0.4s ease-out forwards;
}

@keyframes enemyDeath {
    0% {
        opacity: 1;
        transform: scaleX(var(--dir)) scale(1) rotate(0deg);
    }
    30% {
        opacity: 1;
        transform: scaleX(var(--dir)) scale(1.2) rotate(10deg);
    }
    100% {
        opacity: 0;
        transform: scaleX(var(--dir)) scale(0.6) rotate(-20deg);
    }
}

@keyframes spin {
    from { transform: translate(-50%, -50%) rotate(0deg); }
    to   { transform: translate(-50%, -50%) rotate(360deg); }
}

#doritos-core {
    position: absolute;
    top: 50%;
    left: 50%;
    width: calc(225px * 0.75);
    height: calc(330px * 0.75);
    transform: translate(-50%, -50%);
    background: url('/assets/imgs/doritos.png') no-repeat center/contain;
}

#hitmarker {
    position: absolute;
    z-index: 9999; /* или любое большое число */
    width: 30px;
    height: 30px;
    background: url('/assets/imgs/hitmarker.png') no-repeat center/contain;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.1s ease;
}

.enemy-shoot {
    animation: enemyShoot 0.15s ease-out;
}

@keyframes enemyShoot {
    0% {
        transform: scaleX(var(--dir)) translateX(0) scale(1);
        filter: brightness(1);
    }
    30% {
        transform: scaleX(var(--dir)) translateX(-2px) scale(1.05);
        filter: brightness(1.8) drop-shadow(0 0 4px orange);
    }
    60% {
        transform: scaleX(var(--dir)) translateX(1px) scale(1.02);
        filter: brightness(1.4) drop-shadow(0 0 3px orange);
    }
    100% {
        transform: scaleX(var(--dir)) translateX(0) scale(1);
        filter: brightness(1);
    }
}