/* === ADMIN PANEL === */
#admin-panel {
    pointer-events: auto !important;
}

.admin-btn {
    background: rgba(40, 40, 40, 0.9) !important;
    color: #fff !important;
    border: 2px solid #bd93f9 !important;
    padding: 8px 15px !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    font-weight: bold !important;
    transition: all 0.2s !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.3) !important;
    font-size: 14px !important;
}

.admin-btn:hover {
    background: #bd93f9 !important;
    color: #000 !important;
    transform: translateY(-2px);
}

.admin-btn.active {
    background: #ff6b6b !important;
    border-color: #fff !important;
}

.admin-btn.save {
    background: #4ecdc4 !important;
    border-color: #fff !important;
    color: #000 !important;
}

.admin-btn.save:hover {
    background: #45b7af !important;
    transform: scale(1.05);
}

.prop.translucent {
    opacity: 0.4;
    transition: opacity 0.3s;
}

/* === PREFAB PALETTE === */
.prefab-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 15px;
    padding: 20px;
    max-height: 60vh;
    overflow-y: auto;
    background: #f0f0f0;
}

.prefab-card {
    background: white;
    border-radius: 10px;
    padding: 10px;
    text-align: center;
    cursor: pointer;
    border: 2px solid transparent;
    transition: all 0.2s;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
}

.prefab-card:hover {
    border-color: #bd93f9;
    transform: translateY(-5px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

.prefab-card img {
    max-width: 100%;
    max-height: 80px;
    object-fit: contain;
}

.prefab-card span {
    font-size: 11px;
    color: #666;
    word-break: break-all;
}

.prefab-card.flame {
    background: #fff5e6;
}

.admin-btn.palette {
    background: #ff9de2 !important;
    color: #fff !important;
}

.admin-btn.palette:hover {
    background: #f783d1 !important;
}

/* --- Р В Р’В Р вЂ™Р’В Р В Р’В Р В РІР‚в„–Р В Р’В Р вЂ™Р’В Р В РІР‚в„ўР вЂ™Р’ВР В Р’В Р вЂ™Р’В Р В Р’В Р В РІР‚в„–Р В Р’В Р вЂ™Р’В Р В Р Р‹Р РЋРІР‚С”Р В Р’В Р вЂ™Р’В Р В Р вЂ Р В РІР‚С™Р РЋРЎвЂєР В Р’В Р вЂ™Р’В Р В Р Р‹Р РЋРІвЂћСћР В Р’В Р вЂ™Р’В Р В Р Р‹Р Р†Р вЂљРІвЂћСћ Р В Р’В Р вЂ™Р’В Р В РІР‚в„ўР вЂ™Р’ВР В Р’В Р вЂ™Р’В Р В Р Р‹Р РЋРЎв„ўР В Р’В Р вЂ™Р’В Р В Р вЂ Р В РІР‚С™Р Р†РІР‚С›РЎС›Р В Р’В Р вЂ™Р’В Р В Р вЂ Р В РІР‚С™Р РЋРЎвЂєР В Р’В Р вЂ™Р’В Р В Р Р‹Р РЋРЎв„ўР В Р’В Р вЂ™Р’В Р В Р Р‹Р РЋРІР‚С”Р В Р’В Р вЂ™Р’В Р В Р Р‹Р Р†Р вЂљРІвЂћСћР В Р’В Р вЂ™Р’В Р В РІР‚в„ўР вЂ™Р’В Р В Р’В Р вЂ™Р’В Р В Р’В Р Р†Р вЂљР Р‹ --- */
#inventory-toggle-btn {
    position: absolute;
    top: max(185px, calc(env(safe-area-inset-top) + 185px));
    left: max(10px, env(safe-area-inset-left));
    width: 40px;
    height: 40px;
    background: rgba(255, 255, 255, 0.9);
    border: 2px solid white;
    border-radius: 50%;
    font-size: 20px;
    cursor: pointer;
    z-index: 500;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

@media (max-width: 768px) {
    #inventory-toggle-btn {
        top: max(130px, calc(env(safe-area-inset-top) + 130px));
        width: 36px;
        height: 36px;
        font-size: 18px;
    }
}

#inventory-toggle-btn:hover { transform: scale(1.1); }
#inventory-toggle-btn:active { transform: scale(0.9); }

.inventory-content {
    background: linear-gradient(135deg, #fff9f0 0%, #fff 100%) !important;
    max-width: 500px !important;
    border-radius: 30px !important;
    border: 6px solid #ff9de2 !important;
}

.bits-counter {
    background: rgba(255, 255, 255, 0.8);
    padding: 5px 15px;
    border-radius: 20px;
    font-family: 'Chewy', cursive;
    font-size: 20px;
    color: #f39c12;
    border: 2px solid #f1c40f;
    margin: 0 15px;
}

.inventory-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
    grid-auto-rows: min-content;
    align-content: start;
    gap: 15px;
    padding: 20px;
    max-height: 300px;
    overflow-y: auto;
}

.inventory-item {
    background: white;
    border: 3px solid #eee;
    border-radius: 15px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    transition: all 0.2s;
    position: relative;
}

.inventory-item:hover {
    border-color: #ff9de2;
    transform: translateY(-5px);
    box-shadow: 0 5px 15px rgba(255, 157, 226, 0.3);
}

.inventory-item.selected {
    border-color: #ff9de2;
    background: #fff0f9;
}

.item-icon {
    font-size: 32px;
    margin-bottom: 5px;
}

.item-count {
    position: absolute;
    top: -5px;
    right: -5px;
    background: #ff6b6b;
    color: white;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: bold;
}

.item-details {
    padding: 20px;
    border-top: 2px dashed #ff9de2;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 0 0 24px 24px;
}

.detail-header {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 10px;
}

.detail-header .item-icon {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 40px;
    flex-shrink: 0;
    background: rgba(0,0,0,0.03);
    border-radius: 12px;
    overflow: hidden;
}

.detail-header .item-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

#detail-icon {
    /* Р В Р’В Р В Р вЂ№Р В Р’В Р вЂ™Р’В˜Р В Р’В Р В Р вЂ№Р В Р’В Р РЋРЎвЂєР В Р’В Р Р†Р вЂљРЎС›Р В Р’В Р РЋРЎв„ўР В Р’В Р РЋРІР‚в„ў Р В Р’В Р РЋРЎв„ўРВ Р’В РРЋРІР‚в„ўРВ Р’В Р Р†РвЂљРЎС™РВ Р’В Р РЋРІР‚в„ўРВ Р’В РР†РвЂљРІР‚СњРВ Р’В Р вЂ™Р’В˜РВ Р’В Р РЋРЎС™РВ Р’В РРЋРІР‚С”РВ Р’В Р Р†Р вЂљРІвЂћСћ Р В Р’В Р вЂ™Р’В Р В РІР‚в„ўР вЂ™Р’В Р В Р’В Р В РІР‚В Р В Р’В Р Р†Р вЂљРЎв„ўР В Р вЂ Р В РІР‚С™РРЋРЎС™Р В Р’В Р вЂ™Р’В Р В РІР‚в„ўРвЂ™Р’В РВ Р’В РР†Р вЂљРІвЂћСћР В РІР‚в„ўР вЂ™Р’В°Р В Р’В Р вЂ™Р’В Р В РІР‚в„ўР вЂ™Р’В РВ Р’В Р В Р вЂ№Р В Р вЂ Р В РІР‚С™Р Р†Р вЂљРЎСљР В Р’В Р вЂ™Р’В Р В РІР‚в„ўР вЂ™Р’В Р В Р’В Р В Р вЂ№Р В Р вЂ Р В РІР‚С™РРЋРЎвЂєР В Р’В Р вЂ™Р’В РВ РІР‚в„ўР вЂ™Р’В Р В Р’В РВ РІР‚В Р В Р’В РР†Р вЂљРЎв„ўР В Р Р‹Р РЋРІР‚С”Р В Р’В Р вЂ™Р’В РВ РІР‚в„ўРвЂ™Р’В РВ Р’В РВ Р вЂ№Р В Р Р‹Р РЋРІвЂћСћР В Р’В Р вЂ™Р’В РВ РІР‚в„ўРвЂ™Р’В РВ Р’В Р Р†Р вЂљРІвЂћСћРВ РІР‚в„ўРвЂ™Р’В˜Р В Р’В Р вЂ™Р’В Р В РІР‚в„ўРвЂ™Р’В Р В Р’В РВ РІР‚В Р В Р’В Р Р†РвЂљРЎв„ўРВ Р Р‹Р РЋРІР‚С” */
    width: 64px;
    height: 64px;
}

#detail-desc, #shop-detail-desc, #fair-detail-desc {
    color: #666;
    margin-bottom: 15px;
    font-size: 14px;
    max-height: 80px;
    overflow-y: auto;
    padding-right: 5px;
}

#detail-desc::-webkit-scrollbar, 
#shop-detail-desc::-webkit-scrollbar, 
#fair-detail-desc::-webkit-scrollbar {
    width: 4px;
}
#detail-desc::-webkit-scrollbar-thumb, 
#shop-detail-desc::-webkit-scrollbar-thumb, 
#fair-detail-desc::-webkit-scrollbar-thumb {
    background: #ff9de2;
    border-radius: 4px;
}
/* --- Р В Р’В Р В Р вЂ№Р В Р’В Р вЂ™Р’ВР В Р’В Р В Р вЂ№Р В Р’В Р РЋРЎвЂєР В Р’В Р Р†Р вЂљРЎС›Р В Р’В Р РЋРЎв„ўР В Р’В Р РЋРІР‚в„ў Р В Р’В Р РЋРЎв„ўР В Р’В Р РЋРІР‚в„ўР В Р’В Р Р†Р вЂљРЎС™Р В Р’В Р РЋРІР‚в„ўР В Р’В Р Р†Р вЂљРІР‚СњР В Р’В Р вЂ™Р’ВР В Р’В Р РЋРЎС™Р В Р’В Р РЋРІР‚С”Р В Р’В Р Р†Р вЂљРІвЂћСћ --- */
#interact-btn {
    position: absolute;
    bottom: 180px;
    left: 50%;
    transform: translateX(-50%);
    background: #ff9de2;
    color: white;
    border: 3px solid white;
    padding: 10px 25px;
    border-radius: 25px;
    font-family: 'Fredoka', sans-serif;
    font-size: 18px;
    cursor: pointer;
    z-index: 500;
    box-shadow: 0 4px 15px rgba(255, 157, 226, 0.4);
    animation: pulseInteract 2s infinite;
}

