/* Sprite container in hero section */
#shimeji-container {
    position: relative;
    display: block;
    width: 100%;
    height: 180px;
    margin-top: 30px;
    overflow: hidden;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.shimeji-sprite {
    position: absolute;
    width: 64px;
    height: 64px;
    pointer-events: none;
    z-index: 10;
    image-rendering: pixelated;
    image-rendering: -webkit-optimize-contrast;
    -webkit-transition: filter 0.3s ease;
    transition: filter 0.3s ease;
    /* Subtle glow for visibility on dark backgrounds */
    -webkit-filter: drop-shadow(0 0 3px rgba(255, 255, 255, 0.4));
    filter: drop-shadow(0 0 3px rgba(255, 255, 255, 0.4));
}

/* Remove glow on light theme */
[data-theme="light"] .shimeji-sprite {
    filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.2));
}

.shimeji-sprite.caught {
    filter: brightness(1.2) saturate(0.7) drop-shadow(0 0 4px rgba(255, 215, 0, 0.6));
}

@keyframes shimeji-wiggle {
    0%, 100% { transform: rotate(-3deg); }
    50% { transform: rotate(3deg); }
}

/* Catch particle effect */
.shimeji-particle {
    position: fixed;
    pointer-events: none;
    z-index: 10000;
    border-radius: 50%;
    opacity: 0;
}

/* Toggle link above sprites */
.shimeji-toggle-link {
    display: inline-block;
    font-size: 12px;
    color: var(--text-muted, #94a3b8);
    text-decoration: none;
    opacity: 0.6;
    transition: all 0.2s ease;
    cursor: pointer;
}

.shimeji-toggle-link:hover {
    opacity: 1;
    color: var(--text-secondary, #cbd5e1);
}