/* ===== DUKE NUKEM GAME ENGINE CSS ===== */

/* ===== ENEMY SPRITES ===== */
.enemy-sprite {
    cursor: crosshair !important;
    transition: transform 0.1s, filter 0.1s;
}

.enemy-sprite:hover {
    filter: drop-shadow(0 0 20px rgba(255, 0, 0, 1)) brightness(1.2);
    transform: scale(1.1);
}

.enemy-hit {
    filter: brightness(3) !important;
}

.enemy-death {
    animation: enemyDeath 0.3s ease-out forwards !important;
}

@keyframes enemyFloat {
    0%, 100% { transform: translateY(0) scaleX(1); }
    50% { transform: translateY(-10px) scaleX(-1); }
}

@keyframes enemyDeath {
    0% { transform: scale(1); opacity: 1; filter: brightness(1); }
    50% { transform: scale(1.5); filter: brightness(3); }
    100% { transform: scale(0); opacity: 0; filter: brightness(5); }
}

/* ===== BOSS ENEMY ===== */
.boss-enemy {
    cursor: crosshair !important;
}

.boss-enemy:hover {
    filter: drop-shadow(0 0 40px rgba(255, 0, 0, 1)) brightness(1.1);
}

.boss-hit {
    filter: brightness(3) !important;
}

.boss-health-bar {
    position: absolute;
    bottom: -30px;
    left: 50%;
    transform: translateX(-50%);
    width: 180px;
    height: 20px;
    background: #333;
    border: 2px solid #ff0000;
}

.boss-health-fill {
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #ff0000, #990000);
    transition: width 0.2s;
}

.boss-name {
    position: absolute;
    bottom: -55px;
    left: 50%;
    transform: translateX(-50%);
    font-family: 'Press Start 2P', monospace;
    font-size: 0.6rem;
    color: #ff0000;
    text-shadow: 0 0 10px #ff0000;
    white-space: nowrap;
}

@keyframes bossPulse {
    0%, 100% { filter: drop-shadow(0 0 30px rgba(255, 0, 0, 0.8)); }
    50% { filter: drop-shadow(0 0 50px rgba(255, 0, 0, 1)); }
}

/* Boss spawn animation */
.boss-spawning {
    animation: bossSpawn 0.5s ease-out;
}

@keyframes bossSpawn {
    0% {
        transform: translateX(-50%) scale(0.3);
        filter: brightness(5) drop-shadow(0 0 80px #ff0000);
    }
    50% {
        filter: brightness(2) drop-shadow(0 0 60px #ff0000);
    }
    100% {
        transform: translateX(-50%) scale(1);
        filter: drop-shadow(0 0 30px rgba(255, 0, 0, 0.8));
    }
}

/* Boss pain state */
.boss-pain {
    animation: bossPain 0.15s ease-out !important;
}

@keyframes bossPain {
    0% { filter: brightness(3) hue-rotate(0deg); }
    50% { filter: brightness(2) hue-rotate(-30deg); }
    100% { filter: brightness(1.2) hue-rotate(0deg); }
}

/* Boss active state */
.boss-active {
    cursor: crosshair;
}

.boss-active:hover {
    filter: drop-shadow(0 0 50px rgba(255, 0, 0, 1)) brightness(1.2) !important;
}

/* ===== WEAPON SELECTOR ===== */
.weapon-selector {
    position: fixed;
    top: 60px;
    left: 20px;
    display: flex;
    gap: 5px;
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    padding: 10px;
    border: 2px solid #c09030;
    z-index: 10001;
}

.weapon-label {
    font-family: 'Press Start 2P', monospace;
    font-size: 0.4rem;
    color: #c09030;
    margin-right: 10px;
}

.weapon-slot {
    width: 40px;
    height: 40px;
    background: #1a1a2a;
    border: 2px solid #404050;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    cursor: pointer;
    transition: all 0.2s;
}

.weapon-slot:hover {
    border-color: #c09030;
    background: #2a2a3a;
}

.weapon-slot.active {
    border-color: #ffcc00;
    background: #3a3a4a;
    box-shadow: 0 0 10px rgba(255, 204, 0, 0.5);
}

.weapon-slot.unlocked {
    opacity: 1;
}

/* ===== EXPLOSION EFFECTS ===== */
.explosion-effect {
    pointer-events: none;
}

.explosion-particle {
    position: absolute;
}

@keyframes explodeParticle {
    0% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 1;
    }
    100% {
        transform: translate(
            calc(-50% + cos(var(--angle)) * var(--distance)),
            calc(-50% + sin(var(--angle)) * var(--distance))
        ) scale(0);
        opacity: 0;
    }
}

/* ===== PICKUP EFFECT ===== */
@keyframes pickupFloat {
    0% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 1;
    }
    100% {
        transform: translate(-50%, -150%) scale(1.5);
        opacity: 0;
    }
}

/* ===== SCREEN FLASH ===== */
@keyframes flashFade {
    0% { opacity: 0.7; }
    100% { opacity: 0; }
}

/* ===== SCREEN SHAKE - DUKE STYLE ===== */
@keyframes screenShake {
    0% { transform: translate(0, 0); }
    10% { transform: translate(-8px, -6px); }
    20% { transform: translate(8px, 6px); }
    30% { transform: translate(-6px, 4px); }
    40% { transform: translate(6px, -4px); }
    50% { transform: translate(-4px, 6px); }
    60% { transform: translate(4px, -6px); }
    70% { transform: translate(-6px, 4px); }
    80% { transform: translate(6px, -4px); }
    90% { transform: translate(-2px, 2px); }
    100% { transform: translate(0, 0); }
}

@keyframes screenShakeHeavy {
    0% { transform: translate(0, 0) rotate(0deg); }
    10% { transform: translate(-15px, -10px) rotate(-1deg); }
    20% { transform: translate(15px, 10px) rotate(1deg); }
    30% { transform: translate(-12px, 8px) rotate(-0.5deg); }
    40% { transform: translate(12px, -8px) rotate(0.5deg); }
    50% { transform: translate(-10px, 12px) rotate(-0.3deg); }
    60% { transform: translate(10px, -12px) rotate(0.3deg); }
    70% { transform: translate(-8px, 6px) rotate(0); }
    80% { transform: translate(8px, -6px) rotate(0); }
    90% { transform: translate(-4px, 4px) rotate(0); }
    100% { transform: translate(0, 0) rotate(0deg); }
}

.screen-shake {
    animation: screenShake 0.2s ease-out;
}

.screen-shake-heavy {
    animation: screenShakeHeavy 0.4s ease-out;
}

/* ===== BLOOD SPLATTER EFFECTS ===== */
.blood-splatter {
    position: fixed;
    pointer-events: none;
    z-index: 99999;
    font-size: 2rem;
    animation: bloodSplat 0.5s ease-out forwards;
}

@keyframes bloodSplat {
    0% {
        transform: scale(0.5) rotate(0deg);
        opacity: 1;
    }
    50% {
        transform: scale(1.5) rotate(180deg);
        opacity: 0.8;
    }
    100% {
        transform: scale(2) rotate(360deg) translateY(50px);
        opacity: 0;
    }
}

.blood-pool {
    position: fixed;
    pointer-events: none;
    z-index: 1;
    width: 60px;
    height: 30px;
    background: radial-gradient(ellipse, #8B0000 0%, #4a0000 50%, transparent 70%);
    border-radius: 50%;
    animation: bloodPoolSpread 1s ease-out forwards;
    filter: blur(2px);
}

@keyframes bloodPoolSpread {
    0% {
        transform: scale(0);
        opacity: 0.9;
    }
    100% {
        transform: scale(1);
        opacity: 0.6;
    }
}

/* ===== MUZZLE FLASH ===== */
.muzzle-flash {
    position: fixed;
    pointer-events: none;
    z-index: 100000;
    width: 80px;
    height: 80px;
    background: radial-gradient(circle, #fff 0%, #ffff00 20%, #ff6600 40%, transparent 70%);
    border-radius: 50%;
    animation: muzzleFlash 0.08s ease-out forwards;
    mix-blend-mode: screen;
}

@keyframes muzzleFlash {
    0% {
        transform: scale(0.5);
        opacity: 1;
    }
    100% {
        transform: scale(1.5);
        opacity: 0;
    }
}

/* ===== BULLET IMPACT ===== */
.bullet-impact {
    position: fixed;
    pointer-events: none;
    z-index: 99998;
    width: 30px;
    height: 30px;
    background: radial-gradient(circle, #ff0 0%, #f60 50%, transparent 70%);
    border-radius: 50%;
    animation: bulletImpact 0.15s ease-out forwards;
}

@keyframes bulletImpact {
    0% {
        transform: scale(0);
        opacity: 1;
    }
    50% {
        transform: scale(1.2);
        opacity: 0.8;
    }
    100% {
        transform: scale(0);
        opacity: 0;
    }
}

/* ===== GIB PARTICLES (body parts flying) ===== */
.gib-particle {
    position: fixed;
    pointer-events: none;
    z-index: 99997;
    font-size: 1.5rem;
    animation: gibFly 0.8s ease-out forwards;
}

@keyframes gibFly {
    0% {
        transform: translate(0, 0) rotate(0deg) scale(1);
        opacity: 1;
    }
    60% {
        opacity: 0.8;
    }
    100% {
        transform: translate(var(--end-x), var(--end-y)) rotate(var(--rotation)) scale(0.3);
        opacity: 0;
    }
}

/* ===== KILL COMBO DISPLAY ===== */
.kill-combo {
    position: fixed;
    top: 150px;
    left: 50%;
    transform: translateX(-50%);
    font-family: 'Press Start 2P', monospace;
    font-size: 1.5rem;
    color: #ff0000;
    text-shadow: 0 0 20px #ff0000, 0 0 40px #ff0000;
    z-index: 100001;
    animation: comboAppear 0.3s ease-out;
    white-space: nowrap;
}

.kill-combo.fade-out {
    animation: comboFade 0.5s ease-out forwards;
}

@keyframes comboAppear {
    0% {
        transform: translateX(-50%) scale(2);
        opacity: 0;
    }
    100% {
        transform: translateX(-50%) scale(1);
        opacity: 1;
    }
}

@keyframes comboPopIn {
    0% {
        transform: translateX(-50%) scale(0.3);
        opacity: 0;
    }
    50% {
        transform: translateX(-50%) scale(1.3);
    }
    100% {
        transform: translateX(-50%) scale(1);
        opacity: 1;
    }
}

@keyframes comboFadeOut {
    0% {
        opacity: 1;
        transform: translateX(-50%) scale(1);
    }
    100% {
        opacity: 0;
        transform: translateX(-50%) translateY(-30px) scale(1.2);
    }
}

@keyframes comboFade {
    0% { opacity: 1; }
    100% {
        opacity: 0;
        transform: translateX(-50%) translateY(-30px) scale(1.2);
    }
}

.combo-text {
    font-size: 1.8rem;
    color: #ff0000;
    text-shadow:
        0 0 10px #ff0000,
        0 0 20px #ff0000,
        0 0 40px #ff0000,
        2px 2px 0 #000,
        -2px -2px 0 #000;
    animation: comboPulse 0.2s ease-in-out infinite;
}

.combo-count {
    font-size: 0.8rem;
    color: #ffcc00;
    text-shadow: 0 0 10px #ffcc00;
    margin-top: 5px;
}

@keyframes comboPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

/* ===== MATURE WARNING OVERLAY ===== */
.mature-warning-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.98);
    z-index: 999999;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    animation: fadeIn 0.3s ease-out;
}

.mature-warning-content {
    text-align: center;
    max-width: 600px;
    padding: 2rem;
}

.mature-warning-icon {
    font-size: 4rem;
    margin-bottom: 1rem;
    animation: warningPulse 1s ease-in-out infinite;
}

@keyframes warningPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

.mature-warning-content h2 {
    font-family: 'Press Start 2P', monospace;
    font-size: 1.5rem;
    color: #ff0000;
    text-shadow: 0 0 30px #ff0000;
    margin-bottom: 1.5rem;
}

.mature-warning-content p {
    font-family: 'Press Start 2P', monospace;
    font-size: 0.5rem;
    color: #ccc;
    line-height: 2;
    margin-bottom: 1rem;
}

.mature-warning-content ul {
    list-style: none;
    padding: 0;
    margin: 1rem 0;
}

.mature-warning-content li {
    font-family: 'Press Start 2P', monospace;
    font-size: 0.45rem;
    color: #ff6666;
    padding: 0.5rem 0;
}

.mature-warning-content li::before {
    content: '> ';
    color: #ff0000;
}

.mature-warning-subtitle {
    color: #888 !important;
    font-style: italic;
}

.mature-warning-buttons {
    display: flex;
    gap: 1rem;
    justify-content: center;
    margin: 2rem 0 1rem;
    flex-wrap: wrap;
}

.mature-btn-enter {
    font-family: 'Press Start 2P', monospace;
    font-size: 0.6rem;
    padding: 1rem 1.5rem;
    background: linear-gradient(180deg, #ff0000, #990000);
    border: 3px solid #ff6666;
    color: #fff;
    cursor: pointer;
    transition: all 0.3s;
}

.mature-btn-enter:hover {
    transform: scale(1.1);
    box-shadow: 0 0 30px rgba(255, 0, 0, 0.8);
}

.mature-btn-exit {
    font-family: 'Press Start 2P', monospace;
    font-size: 0.5rem;
    padding: 1rem 1.5rem;
    background: #333;
    border: 2px solid #666;
    color: #888;
    cursor: pointer;
    transition: all 0.3s;
}

.mature-btn-exit:hover {
    background: #444;
    color: #fff;
}

.mature-warning-footer {
    color: #ffcc00 !important;
    font-size: 0.4rem !important;
    margin-top: 1rem;
}

/* Fade animations */
@keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@keyframes fadeOut {
    0% { opacity: 1; }
    100% { opacity: 0; }
}

/* Legacy class support */
.mature-warning {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.98);
    z-index: 999999;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2rem;
}

.mature-warning h1 {
    font-family: 'Press Start 2P', monospace;
    font-size: 2rem;
    color: #ff0000;
    text-shadow: 0 0 30px #ff0000;
}

.mature-warning p {
    font-family: 'Press Start 2P', monospace;
    font-size: 0.6rem;
    color: #888;
    text-align: center;
    max-width: 600px;
    line-height: 2;
}

.mature-warning button {
    font-family: 'Press Start 2P', monospace;
    font-size: 0.8rem;
    padding: 1rem 2rem;
    background: linear-gradient(180deg, #ff0000, #990000);
    border: 3px solid #ff6666;
    color: #fff;
    cursor: pointer;
    transition: all 0.3s;
}

.mature-warning button:hover {
    transform: scale(1.1);
    box-shadow: 0 0 30px rgba(255, 0, 0, 0.8);
}

/* ===== CHEAT MESSAGE ===== */
.cheat-message {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: rgba(0, 0, 0, 0.95);
    border: 3px solid #00ff00;
    padding: 20px 40px;
    font-family: 'Press Start 2P', monospace;
    font-size: 1rem;
    color: #00ff00;
    text-shadow: 0 0 20px #00ff00;
    z-index: 100000;
    animation: cheatAppear 0.3s ease-out;
}

.cheat-icon {
    margin-right: 15px;
}

.cheat-message.fade-out {
    animation: cheatFade 0.5s ease-out forwards;
}

@keyframes cheatAppear {
    0% { transform: translate(-50%, -50%) scale(0.5); opacity: 0; }
    100% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
}

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

/* ===== SECRET AREAS ===== */
.secret-area {
    background: radial-gradient(circle, rgba(255, 204, 0, 0.3), transparent);
    border-radius: 50%;
}

.secret-area.hint-visible {
    opacity: 0.5 !important;
    animation: secretPulse 1s ease-in-out infinite;
}

.secret-area.revealed {
    opacity: 0 !important;
    pointer-events: none;
}

@keyframes secretPulse {
    0%, 100% { box-shadow: 0 0 20px #ffcc00; }
    50% { box-shadow: 0 0 40px #ffcc00; }
}

/* ===== SECRET MESSAGE ===== */
.secret-message {
    position: fixed;
    top: 100px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.95);
    border: 3px solid #ffcc00;
    padding: 20px 30px;
    font-family: 'Press Start 2P', monospace;
    font-size: 0.7rem;
    color: #ffcc00;
    text-shadow: 0 0 10px #ffcc00;
    z-index: 100000;
    animation: secretAppear 0.5s ease-out;
}

.secret-icon {
    margin-right: 10px;
    font-size: 1.2rem;
}

.secret-reward {
    color: #00ff00;
    margin-left: 10px;
}

.secret-message.fade-out {
    animation: secretFade 0.5s ease-out forwards;
}

@keyframes secretAppear {
    0% { transform: translateX(-50%) translateY(-50px); opacity: 0; }
    100% { transform: translateX(-50%) translateY(0); opacity: 1; }
}

@keyframes secretFade {
    0% { opacity: 1; }
    100% { opacity: 0; transform: translateX(-50%) translateY(-30px); }
}

/* ===== ACHIEVEMENT SYSTEM ===== */
.achievement-container {
    position: fixed;
    top: 120px;
    right: 20px;
    z-index: 100000;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.achievement-popup {
    display: flex;
    gap: 15px;
    align-items: center;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.95), rgba(30, 30, 50, 0.95));
    border: 3px solid #c09030;
    padding: 15px 20px;
    animation: achievementSlide 0.5s ease-out;
}

.achievement-icon {
    font-size: 2rem;
    filter: drop-shadow(0 0 10px rgba(255, 204, 0, 0.5));
}

.achievement-info {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.achievement-title {
    font-family: 'Press Start 2P', monospace;
    font-size: 0.4rem;
    color: #c09030;
}

.achievement-name {
    font-family: 'Press Start 2P', monospace;
    font-size: 0.6rem;
    color: #ffcc00;
    text-shadow: 0 0 10px #ffcc00;
}

.achievement-desc {
    font-family: 'Press Start 2P', monospace;
    font-size: 0.35rem;
    color: #888;
}

.achievement-popup.fade-out {
    animation: achievementFade 0.5s ease-out forwards;
}

@keyframes achievementSlide {
    0% { transform: translateX(100px); opacity: 0; }
    100% { transform: translateX(0); opacity: 1; }
}

@keyframes achievementFade {
    0% { opacity: 1; }
    100% { opacity: 0; transform: translateX(50px); }
}

/* ===== GOD MODE ===== */
.god-mode .duke-hud {
    border-color: #00ff00 !important;
    box-shadow: 0 0 20px rgba(0, 255, 0, 0.5);
}

.god-mode .hud-health,
.god-mode .hud-armor {
    color: #00ff00 !important;
    text-shadow: 0 0 20px #00ff00;
    animation: godModePulse 1s ease-in-out infinite;
}

@keyframes godModePulse {
    0%, 100% { text-shadow: 0 0 20px #00ff00; }
    50% { text-shadow: 0 0 40px #00ff00, 0 0 60px #00ff00; }
}

/* ===== STEROIDS MODE ===== */
.steroids-mode {
    animation: steroidsEffect 0.1s linear infinite;
}

@keyframes steroidsEffect {
    0% { filter: hue-rotate(0deg) saturate(1.5); }
    25% { filter: hue-rotate(90deg) saturate(1.5); }
    50% { filter: hue-rotate(180deg) saturate(1.5); }
    75% { filter: hue-rotate(270deg) saturate(1.5); }
    100% { filter: hue-rotate(360deg) saturate(1.5); }
}

/* ===== FPS COUNTER ===== */
.fps-counter {
    position: fixed;
    top: 60px;
    left: 50%;
    transform: translateX(-50%);
    font-family: 'Press Start 2P', monospace;
    font-size: 0.5rem;
    color: #00ff00;
    background: rgba(0, 0, 0, 0.8);
    padding: 5px 15px;
    border: 1px solid #00ff00;
    z-index: 100001;
}

/* ===== NOCLIP MODE ===== */
.noclip-mode * {
    pointer-events: auto !important;
}

/* ===== PARALLAX LAYERS ===== */
.parallax-stars {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('../images/stars.png') repeat;
    z-index: -10;
    pointer-events: none;
}

.parallax-buildings-far {
    position: fixed;
    bottom: 80px;
    left: 0;
    width: 200%;
    height: 300px;
    background: url('../images/buildings-far.png') repeat-x bottom;
    z-index: -5;
    pointer-events: none;
    opacity: 0.5;
}

.parallax-buildings-near {
    position: fixed;
    bottom: 80px;
    left: 0;
    width: 200%;
    height: 200px;
    background: url('../images/buildings-near.png') repeat-x bottom;
    z-index: -3;
    pointer-events: none;
    opacity: 0.8;
}

/* ===== DEATHMATCH SECTION ===== */
.deathmatch-section {
    background: linear-gradient(180deg, rgba(255, 0, 0, 0.1), transparent, rgba(255, 0, 0, 0.1));
    padding: 4rem 2rem;
    margin: 2rem 0;
}

.deathmatch-title {
    font-size: 1.5rem;
    color: #ff0000;
    text-shadow: 0 0 30px #ff0000;
    text-align: center;
    margin-bottom: 2rem;
}

.deathmatch-arena {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 2rem;
    align-items: center;
    max-width: 1000px;
    margin: 0 auto;
}

.competitor-card {
    background: linear-gradient(180deg, #1a1a2e, #0d0d1a);
    border: 3px solid #404050;
    padding: 2rem;
    text-align: center;
    transition: all 0.3s;
}

.competitor-card.winner {
    border-color: #ffcc00;
    box-shadow: 0 0 30px rgba(255, 204, 0, 0.5);
}

.competitor-card.loser {
    opacity: 0.6;
    filter: grayscale(0.5);
}

.competitor-logo {
    font-size: 3rem;
    margin-bottom: 1rem;
}

.competitor-name {
    font-family: 'Press Start 2P', monospace;
    font-size: 0.8rem;
    color: #fff;
    margin-bottom: 1rem;
}

.competitor-stats {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.stat-row {
    display: flex;
    justify-content: space-between;
    font-family: 'Press Start 2P', monospace;
    font-size: 0.4rem;
}

.stat-label {
    color: #888;
}

.stat-value {
    color: #ffcc00;
}

.vs-badge {
    font-family: 'Press Start 2P', monospace;
    font-size: 2rem;
    color: #ff0000;
    text-shadow: 0 0 20px #ff0000;
    animation: vsPulse 1s ease-in-out infinite;
}

@keyframes vsPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.2); }
}

/* ===== BOSS BATTLE SECTION ===== */
.boss-section {
    background: linear-gradient(180deg, #1a0000, #0a0a14, #1a0000);
    padding: 4rem 2rem;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.boss-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(ellipse at center, transparent 40%, rgba(255, 0, 0, 0.2) 100%);
    pointer-events: none;
}

.boss-title {
    font-size: 1.5rem;
    color: #ff0000;
    text-shadow: 0 0 30px #ff0000;
    margin-bottom: 2rem;
}

.boss-container {
    position: relative;
    display: inline-block;
    cursor: crosshair;
}

.boss-image {
    width: 300px;
    height: auto;
    image-rendering: pixelated;
    filter: drop-shadow(0 0 30px rgba(255, 0, 0, 0.8));
    animation: bossIdle 2s ease-in-out infinite;
}

@keyframes bossIdle {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-15px); }
}

.boss-challenge {
    font-family: 'Press Start 2P', monospace;
    font-size: 0.6rem;
    color: #ff6666;
    margin-top: 2rem;
    line-height: 2;
}

.boss-button {
    display: inline-block;
    margin-top: 2rem;
    padding: 1rem 2rem;
    background: linear-gradient(180deg, #ff0000, #990000);
    border: 3px solid #ff6666;
    color: #fff;
    font-family: 'Press Start 2P', monospace;
    font-size: 0.7rem;
    cursor: pointer;
    transition: all 0.3s;
}

.boss-button:hover {
    transform: scale(1.1);
    box-shadow: 0 0 30px rgba(255, 0, 0, 0.8);
}

/* ===== INTRO SEQUENCE ===== */
.duke-intro-sequence {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: 999998;
    display: flex;
    align-items: center;
    justify-content: center;
}

.intro-content {
    text-align: center;
    max-width: 800px;
    padding: 2rem;
}

/* ESRB Rating Box */
.intro-rating {
    margin-bottom: 1.5rem;
}

.esrb-rating {
    display: inline-flex;
    align-items: flex-start;
    gap: 15px;
    background: #000;
    padding: 10px;
}

.esrb-box {
    width: 70px;
    height: 90px;
    background: #000;
    border: 3px solid #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
}

.esrb-letter {
    font-family: Arial Black, sans-serif;
    font-size: 3rem;
    font-weight: 900;
    color: #fff;
    line-height: 1;
}

.esrb-text {
    font-family: Arial, sans-serif;
    font-size: 0.45rem;
    font-weight: bold;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 2px;
}

.esrb-descriptors {
    text-align: left;
    font-family: Arial, sans-serif;
    font-size: 0.6rem;
    color: #fff;
    line-height: 1.6;
}

.esrb-descriptors div {
    white-space: nowrap;
}

.intro-duke-face {
    margin-bottom: 1.5rem;
}

.intro-duke-img {
    width: 250px;
    height: auto;
    image-rendering: auto;
    filter: drop-shadow(0 0 30px #ff0000);
    animation: introFacePulse 2s ease-in-out infinite;
}

@keyframes introFacePulse {
    0%, 100% { transform: scale(1); filter: drop-shadow(0 0 30px #ff0000); }
    50% { transform: scale(1.05); filter: drop-shadow(0 0 50px #ff0000); }
}

.intro-text {
    margin-bottom: 1.5rem;
}

.intro-enter {
    margin-top: 2rem;
}

.intro-enter-btn {
    font-family: 'Press Start 2P', monospace;
    font-size: 0.8rem;
    padding: 1rem 2rem;
    background: linear-gradient(180deg, #ff0000, #990000);
    border: 3px solid #ff6666;
    color: #fff;
    cursor: pointer;
    transition: all 0.3s;
    animation: enterPulse 1.5s ease-in-out infinite;
}

.intro-enter-btn:hover {
    transform: scale(1.1);
    box-shadow: 0 0 30px rgba(255, 0, 0, 0.8);
}

@keyframes enterPulse {
    0%, 100% { box-shadow: 0 0 10px rgba(255, 0, 0, 0.5); }
    50% { box-shadow: 0 0 25px rgba(255, 0, 0, 0.8); }
}

.intro-warning {
    font-family: 'Press Start 2P', monospace;
    font-size: 0.35rem;
    color: #666;
    margin-top: 1rem;
}

.intro-skip {
    font-family: 'Press Start 2P', monospace;
    font-size: 0.5rem;
    padding: 0.5rem 1rem;
    background: transparent;
    border: 1px solid #666;
    color: #666;
    cursor: pointer;
    transition: all 0.3s;
}

.intro-skip:hover {
    border-color: #fff;
    color: #fff;
}

/* ===== EASTER EGG NEON SIGN ===== */
.easter-egg-neon {
    text-align: center;
}

.neon-text {
    font-family: 'Press Start 2P', monospace;
    font-size: 2rem;
    color: #ff1493;
    text-shadow:
        0 0 10px #ff1493,
        0 0 20px #ff1493,
        0 0 40px #ff1493,
        0 0 80px #ff1493;
    animation: neonFlicker 0.1s ease-in-out infinite alternate;
}

.neon-subtitle {
    font-family: 'Press Start 2P', monospace;
    font-size: 0.6rem;
    color: #ff69b4;
    text-shadow: 0 0 10px #ff69b4;
    margin-top: 1rem;
}

@keyframes neonFlicker {
    0% { opacity: 1; }
    50% { opacity: 0.8; }
    100% { opacity: 1; }
}

/* ===== DANCER SILHOUETTES ===== */
@keyframes dancerBounce {
    0%, 100% { transform: translateY(0) scaleX(1); }
    25% { transform: translateY(-20px) scaleX(-1); }
    50% { transform: translateY(0) scaleX(-1); }
    75% { transform: translateY(-20px) scaleX(1); }
}

/* ===== SMOKE ANIMATION ===== */
.duke-cigar {
    position: absolute;
}

.smoke-particles {
    position: relative;
}

@keyframes smokeRise {
    0% {
        transform: translateY(0) translateX(0) scale(1);
        opacity: 0.7;
    }
    100% {
        transform: translateY(-50px) translateX(20px) scale(2);
        opacity: 0;
    }
}

/* ===== WEAPON HOVER TOOLTIP ===== */
.weapon-hover-tooltip {
    box-shadow: 0 0 20px rgba(255, 108, 44, 0.5);
}

@keyframes tooltipFadeIn {
    0% {
        opacity: 0;
        transform: translateX(-50%) translateY(-10px);
    }
    100% {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}

@keyframes tooltipFadeOut {
    0% {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
    100% {
        opacity: 0;
        transform: translateX(-50%) translateY(-10px);
    }
}

/* Weapons table row hover enhancement */
.weapons-table tbody tr {
    cursor: pointer;
    transition: all 0.2s ease;
}

.weapons-table tbody tr:hover {
    background: rgba(255, 102, 0, 0.15) !important;
    transform: scale(1.01);
}

.weapons-table tbody tr:hover td {
    color: #ffcc00;
    text-shadow: 0 0 10px #ffcc00;
}

.weapons-table tbody tr:hover img {
    filter: drop-shadow(0 0 10px #ff6c2c) brightness(1.2);
    transform: scale(1.2);
    transition: all 0.2s ease;
}

/* Feature card weapon hover enhancement */
.feature-card[data-weapon]:hover .feature-icon img {
    filter: drop-shadow(0 0 15px #ff6c2c);
    transform: scale(1.1) rotate(-5deg);
    transition: all 0.2s ease;
}

/* Feature cards are clickable */
.feature-card[data-weapon] {
    cursor: pointer;
}

/* Feature card active state - synced with HUD */
.feature-card.active {
    border-color: #ff6c2c !important;
    box-shadow:
        0 0 20px rgba(255, 108, 44, 0.5),
        inset 0 0 30px rgba(255, 108, 44, 0.1) !important;
    transform: scale(1.02);
    transition: all 0.2s ease;
}

.feature-card.active .feature-icon img {
    filter: drop-shadow(0 0 20px #ff6c2c);
    transform: scale(1.15);
}

.feature-card.active .feature-title {
    color: #ff6c2c;
    text-shadow: 0 0 10px rgba(255, 108, 44, 0.8);
}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
    .weapon-selector {
        top: auto;
        bottom: 80px;
        left: 10px;
        right: 10px;
        justify-content: center;
    }

    .weapon-slot {
        width: 35px;
        height: 35px;
        font-size: 1rem;
    }

    .deathmatch-arena {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .vs-badge {
        font-size: 1.5rem;
    }

    .achievement-container {
        left: 10px;
        right: 10px;
    }

    .achievement-popup {
        width: 100%;
    }

    .weapon-hover-tooltip {
        font-size: 0.4rem;
        padding: 0.4rem 0.8rem;
    }
}