.result-display{
    background-image: url('../../assets/img/result-crafting.webp');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.crafting,
.crafting-display{
    background-image: url('../../assets/img/crafting.webp');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.result-crafting{
    background-image: url('../../assets/img/result-crafting.webp');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.pixel-art {
  image-rendering: pixelated;
  image-rendering: crisp-edges;
}

.item-card {
    transition: all 0.3s ease;
    cursor: pointer;
    border: 2px solid #e5e7eb;
}

.item-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 16px rgba(0,0,0,0.15);
    border-color: #7ead49;
}

.tab-button {
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.tab-button.active {
    background: #7ead49;
    color: white;
    border-color: #5a8534;
    font-weight: bold;
}

.tab-button:hover:not(.active) {
    background: #e8f5e0;
    border-color: #7ead49;
}

.item-icon {
    width: 48px;
    height: 48px;
    image-rendering: pixelated;
}

.modal-overlay {
    backdrop-filter: blur(4px);
}

.item-slot-modal {
    width: 60px;
    height: 60px;
}

.item-slot-modal img {
    width: 48px;
    height: 48px;
    image-rendering: pixelated;
}