/* --- CSS СТИЛИ --- */
       

        /* Фильтры */
        .controls {text-align: center; margin: 10px auto; padding:20px; }
        .filter-btn {
            padding: 10px 20px; margin: 5px; border: none; border-radius: 10px;
            background: #3498db; cursor: pointer; transition: 0.3s; box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        }
        .filter-btn:hover { background: #68b63a; color: white; }

        /* Сетка галереи */
        .gallery {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
            gap: 20px; padding: 0 30px 40px; max-width: 1080px; margin: 0 auto;
        }
        .item-2{
            width: 100%; height: 250px; object-fit: cover; border-radius: 12px;
            cursor: pointer; transition: 0.4s; box-shadow: 0 4px 10px rgba(0,0,0,0.1);
        }
        .item:hover { transform: translateY(-5px) scale(1.02); }
        .hide { display: none; }

        /* Модальное окно */
        .full-box {
            display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%;
            background: rgba(0,0,0,0.95); z-index: 1000; align-items: center; justify-content: center;
            flex-direction: column; animation: fadeIn 0.3s;
        }
        @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

        .img-container { text-align: center; position: relative; width: 80%; }
        #fullImg { max-width: 100%; max-height: 80vh; border-radius: 5px; transition: 0.3s; }
        #caption { color: white; margin-top: 15px; font-size: 1.2rem; }

        /* Кнопки управления */
        .nav-btn, .close-btn, #playBtn {
            position: absolute; color: white; background: rgba(255,255,255,0.1);
            border: none; padding: 15px; cursor: pointer; border-radius: 50%; transition: 0.3s;
        }
        .nav-btn:hover, .close-btn:hover { background: rgba(255,255,255,0.3); }
        
        .prev { left: -60px; top: 50%; transform: translateY(-50%); }
        .next { right: -60px; top: 50%; transform: translateY(-50%); }
        .close-btn { top: -50px; right: 0; font-size: 20px; }
        #playBtn { top: 20px; left: 20px; border-radius: 5px; padding: 10px 20px; }

        @media (max-width: 768px) {
            .prev { left: 10px; } .next { right: 10px; }
            .img-container { width: 95%; }
        }
        .like-bar a:hover { background-color: #059587 !important; }