body, html {
    touch-action: manipulation;
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
}

.touch-action-none {
    touch-action: none;
}

.game-shadow {
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
}

.btn-bounce {
    transition: transform 0.2s;
}

.btn-bounce:hover {
    transform: translateY(-3px);
}

.btn-bounce:active {
    transform: translateY(1px);
}

.dawn-bg { background: linear-gradient(to bottom, #FF9A8B, #FF6A88, #FF99AC); }
.morning-bg { background: linear-gradient(to bottom, #87CEEB, #E0F7FA); }
.forenoon-bg { background: linear-gradient(to bottom, #4DA0FF, #87CEEB); }
.noon-bg { background: linear-gradient(to bottom, #FFD700, #FFEC8B); }
.afternoon-bg { background: linear-gradient(to bottom, #FFB347, #FFCC33); }
.dusk-bg { background: linear-gradient(to bottom, #FF8E53, #FE6B8B); }
.evening-bg { background: linear-gradient(to bottom, #6A5ACD, #836FFF); }
.night-bg { background: linear-gradient(to bottom, #1A237E, #283593); }
.midnight-bg { background: linear-gradient(to bottom, #0F044C, #141E61); }
.late-night-bg { background: linear-gradient(to bottom, #0A043C, #0F044C); }
.special-bg { background: linear-gradient(to bottom, #FF69B4, #FF1493); }

.pulse-slow {
    animation: pulse 3s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

.character-selector {
    transition: transform 0.2s, box-shadow 0.2s;
}

.character-selector:hover {
    transform: scale(1.1);
}

.character-selector.selected {
    box-shadow: 0 0 0 3px #FFD166, 0 0 0 6px white;
}

.boss-warning {
    animation: flash 1s alternate infinite;
}

@keyframes flash {
    from { opacity: 0.7; transform: scale(1); }
    to { opacity: 1; transform: scale(1.1); }
}

.collectible-pop {
    animation: pop 0.5s ease-out;
}

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

.sound-toggle {
    transition: all 0.3s ease;
}

.sound-toggle.off {
    opacity: 0.5;
}

.player-shield {
    animation: shield 2s linear infinite;
}

@keyframes shield {
    0% { box-shadow: 0 0 0 0 rgba(0, 150, 255, 0.7); }
    70% { box-shadow: 0 0 0 10px rgba(0, 150, 255, 0); }
    100% { box-shadow: 0 0 0 0 rgba(0, 150, 255, 0); }
}