#task-navigator-wrapper .navigator-grid { display: grid; grid-template-columns: 1fr; gap: 15px; padding: 0px 0; }
        #task-navigator-wrapper .nav-card { 
            background: #ffffff;
            border: 1px solid #D7DCE2; 
            border-radius: 10px; 
            padding: 0; /* ИЗМЕНЕНО: отступы перенесены внутрь элементов */
            text-decoration: none !important; 
            color: #202124 !important; 
            transition: all 0.2s !important;
            display: flex;
            flex-direction: column;
			box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1) !important;
            overflow: hidden; /* Чтобы затемненный фон не вылезал за скругления */
			position: relative;
        }
        
		@media (hover: hover) {
        #task-navigator-wrapper .nav-card:hover { 
            /* filter отсюда убрали, чтобы аккордеон не темнел */
            box-shadow: none !important;
        }
		}
        
        #task-navigator-wrapper .nav-title { font-weight: 500; font-size: 18px; margin-bottom: 5px; line-height: 1.3; min-height: 0; 
	/* Выравнивание и переносы */
    text-align: justify; 
    white-space: normal; 
    word-wrap: break-word; 
    hyphens: auto; 
    -webkit-hyphens: auto; 
    -ms-hyphens: auto;
		}

        /* Невидимый блок-распорка для красивого обтекания текста */
        #task-navigator-wrapper .reset-btn-placeholder {
            float: right;
            width: 70px; /* Ширина кнопки с запасом */
            height: 15px; /* Высота, на которую нельзя заезжать тексту */
            margin-left: 10px; /* Отступ слева от текста до кнопки */
            margin-top: -5px; /* Корректировка высоты под кнопку */
            clear: right;
        }
        
        #task-navigator-wrapper .nav-progress-wrapper {
			display: flex;
			align-items: center;
			gap: 12px;
			margin-top: 5px;
		}
        
        #task-navigator-wrapper .nav-mini-stats {
			display: flex;gap: 8px;
			font-weight: 600;
			font-size: 16px;
			white-space: nowrap;
		}

        #task-navigator-wrapper .stat-v-total { color: #202124; }
        #task-navigator-wrapper .stat-v-correct { color: #00A84E; }
        #task-navigator-wrapper .stat-v-wrong { color: #D93025; }

        #task-navigator-wrapper .progress-multi {
			flex-grow: 1;
			background: #D7DCE2;
			height: 8px;
			border-radius: 10px;
			overflow: hidden;
        }
					   
        #task-navigator-wrapper .p-total-progress {
			background: #00A84E;
			height: 100%;
			transition: width 0.3s;
			width: 0%;
        }

        /* ==========================================================================
           СТИЛИ АККОРДЕОНА И КВАДРАТИКОВ ЗАДАНИЙ
           ========================================================================== */
        
        /* Обертка для верхней части карточки (чтобы она осталась кликабельной) */
        #task-navigator-wrapper .nav-card-main-link {
            text-decoration: none !important;
            color: inherit !important;
            display: flex;
            flex-direction: column;
            flex-grow: 1;
            padding: 10px 10px 15px 10px; /* ПЕРЕНЕСЛИ СЮДА: внутренние отступы */
            background-color: #ffffff; /* Свой фон, чтобы темнела только эта часть */
            transition: filter 0.2s !important; /* Анимация затемнения */
        }

        /* Затемняем ТОЛЬКО верхнюю часть карточки */
		@media (hover: hover) {
        #task-navigator-wrapper .nav-card-main-link:hover {
            filter: brightness(0.8) !important; 
        }
		}

        /* Контейнер всего аккордеона */
        #task-navigator-wrapper .nav-accordion {
            /* margin-top убрали, так как теперь есть padding-bottom у верхней ссылки */
            background-color: #ffffff; /* Жестко белый фон, чтобы он перекрывал все затемнения */
            padding-bottom: 5px; /* Вернули нижний отступ карточки */
        }

        /* Шапка аккордеона (Текст "Открыть отдельные задания") */
 		#task-navigator-wrapper .nav-accordion-header {
    		display: flex;
    		justify-content: space-between;
    		align-items: center;
    		cursor: pointer;
    		margin: 0; /* Убрали внешние отступы, чтобы border-top растянулся от края до края */
    		padding: 10px 10px; /* Добавили 10px по бокам, чтобы заголовок и иконка остались на месте */
    		border-top: 2px solid #D7DCE2; 
    		color: #202124; 
    		font-size: 16px; 
    		font-weight: 500; 
    		transition: color 0.2s;
    		user-select: none;
		}

        /* Иконка стрелочки (Как в главном меню уроков) */
        #task-navigator-wrapper .nav-acc-chevron {
            width: 14px;
            height: 8px;
            position: relative;
            transition: transform 0.2s ease;
        }
        #task-navigator-wrapper .nav-acc-chevron::before, .nav-acc-chevron::after {
            content: ''; position: absolute; top: 50%;
            width: 9px; height: 2px; background: #6B7280; 
        }
        #task-navigator-wrapper .nav-acc-chevron::before { left: 0; transform: translateY(-50%) rotate(45deg); }
        #task-navigator-wrapper .nav-acc-chevron::after { right: 0; transform: translateY(-50%) rotate(-45deg); }
        #task-navigator-wrapper .nav-accordion.open .nav-acc-chevron { transform: rotate(180deg); }

        /* Контейнер с квадратиками (скрыт по умолчанию) */
        #task-navigator-wrapper .nav-accordion-content {
            display: none; /* Контейнер остается стандартным блоком, jQuery вычисляет высоту идеально */
            padding: 5px 10px 0 10px; 
            /* gap и flex-wrap убрали */
        }

        /* ДИЗАЙН КВАДРАТИКОВ ЗАДАНИЙ */
        #task-navigator-wrapper .task-square {
            display: inline-flex; /* Встают в ряд, но внутри текст идеально центрируется */
            vertical-align: top; /* Выравнивание верхнего края квадратиков */
            margin-right: 8px; /* Замена свойству gap (расстояние по горизонтали) */
            margin-bottom: 8px; /* Замена свойству gap (расстояние по вертикали) */
            align-items: center;
            justify-content: center;
            width: 35px; /* Ширина квадратика */
            height: 35px; /* Высота квадратика */
            border-radius: 10px; /* Скругление углов */
            font-size: 16px; /* Размер цифры */
            font-weight: 500; /* Жирность цифры */
            text-decoration: none !important;
            transition: all 0.2s !important;
            box-sizing: border-box;
        }

		@media (hover: hover) {
        #task-navigator-wrapper .task-square:hover {
            filter: brightness(0.8) !important;
			box-shadow: none !important;
        }
		}

        /* СОСТОЯНИЯ КВАДРАТИКОВ (ЦВЕТА) */
        /* 1. Не решалось (Белый) */
        #task-navigator-wrapper .task-sq-unsolved {
            background-color: #ffffff; /* Цвет фона */
            border: 2px solid #D7DCE2; /* Цвет рамки */
            color: #202124 !important; /* Цвет текста */
			box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1) !important;
        }

        /* 2. Решено верно (Зеленый) */
        #task-navigator-wrapper .task-sq-correct {
            background-color: #EEF8F2; 
            border: 2px solid #00A84E; 
            color: #00A84E !important; 
			box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1) !important;
        }

        /* 3. Решено с ошибкой (Красный) */
        #task-navigator-wrapper .task-sq-wrong {
            background-color: #FFF5F5; 
            border: 2px solid #D93025; 
            color: #D93025 !important; 
			box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1) !important;
        }

	/* =================================================================
           КНОПКА "СБРОСИТЬ"
           ================================================================= */
        #task-navigator-wrapper .reset-category-btn {
            position: absolute;
            top: 5px;
            right: 5px;
            background: #ffffff !important;
            color: #6B7280 !important;
            font-size: 14px !important;
            font-weight: 600 !important;
            padding: 5px 15px !important;
            border: 2px solid #6B7280 !important;
            border-radius: 10px !important;
            cursor: pointer !important;
            box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1) !important;
            transition: all 0.2s !important;
            z-index: 10;
        }
        
		@media (hover: hover) {
        #task-navigator-wrapper .reset-category-btn:hover { 
            background: #E6E9ED !important;
            color: #202124 !important;
            border-color: #202124 !important;
            box-shadow: none !important;
        }
		}
	
        #task-navigator-wrapper .reset-category-btn:disabled {
            background: #e5e7eb !important;
            color: #9ca3af !important;
            border-color: #d1d5db !important;
            cursor: not-allowed !important;
            box-shadow: none !important;
            pointer-events: none !important;
        }

/* ==========================================================================
   НАВИГАЦИОННЫЕ СЕТКИ И КНОПКИ
========================================================================== */
#task-navigator-wrapper .top-nav-grid { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; width: 100%; margin-top: 10px; margin-bottom: 10px; }
#task-navigator-wrapper .bottom-nav-grid { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; width: 100%; margin-top: 10px; margin-bottom: 10px; }

#task-navigator-wrapper .text-align-left { text-align: left; }
#task-navigator-wrapper .text-align-center { text-align: center; }

#task-navigator-wrapper .arrow-down { display: inline-block; transform: rotate(-90deg); font-size: 18px; line-height: 1; }
#task-navigator-wrapper .arrow-up { display: inline-block; transform: rotate(90deg); font-size: 18px; line-height: 1; }

#task-navigator-wrapper .my-custom-blue-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: #ffffff !important;
    color: #6B7280 !important;
    border: 2px solid #6B7280 !important;
    border-radius: 10px !important;
    padding: 5px 10px !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    text-decoration: none !important;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1) !important;
    transition: background-color 0.2s, box-shadow 0.2s !important;
    line-height: 1 !important;
}

#task-navigator-wrapper .my-custom-blue-btn.is-clicked {
    pointer-events: none !important;
    filter: brightness(0.8) !important;
    box-shadow: none !important;
}

@media (hover: hover) {
    #task-navigator-wrapper .my-custom-blue-btn:hover {
        background-color: #E6E9ED !important;
        border-color: #202124 !important;
        box-shadow: 0 3px 5px rgba(0, 0, 0, 0) !important;
        color: #202124 !important;
    }
}

	/* =================================================================
                                  SWEETALERT2
           ================================================================= */

	div:where(.swal2-container) { font-family: 'Inter', sans-serif !important; z-index: 50 !important; }
	
	.swal2-container .swal2-popup.category-reset-popup { 
		border: 2px solid #0066CD !important; 
		border-radius: 10px !important; 
		padding: 15px !important; 
		box-shadow: 0 0 15px rgba(0.5, 0.5, 0.5, 0.5) !important;
		width: 90% !important;
		max-width: 600px !important;
	}

	.category-reset-popup .swal2-title { display: none !important; }
	
	.swal2-container .category-reset-popup .swal2-html-container,
	.swal2-container .category-reset-popup .swal2-content,
	.swal2-container .category-reset-popup #swal2-html-container,
	.swal2-container .category-reset-popup #swal2-content,
	.category-reset-popup .swal2-html-container,
	.category-reset-popup .swal2-content {
		font-size: 16px !important;
		color: #202124 !important;
		font-weight: 500 !important;
		text-align: center !important;
		margin: 0 0 15px 0 !important;
		padding: 0 !important;
	}
	
	.category-reset-popup .swal2-actions { margin-top: 5px !important; gap: 15px !important; }
		
	.swal-custom-btn {
		background: #ffffff !important; color: #0066CD !important;
		font-size: 16px !important; font-weight: 600 !important;
		padding: 8px 20px !important; border: 2px solid #0066CD !important;
		border-radius: 10px !important; cursor: pointer !important;
		box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1) !important; 
		transition: background-color 0.2s, box-shadow 0.2s !important;
	}

	.swal-custom-btn:hover {
		background: #E6E9ED !important; color: #00468D !important;
		border-color: #00468D !important; box-shadow: none !important;
	}

/* ==========================================================================
           Блокировка повторного нажатия кнопок
========================================================================== */

#task-navigator-wrapper a[class*="btn"].is-clicked, 
#task-navigator-wrapper a[class*="nav-card"].is-clicked,
#task-navigator-wrapper button[class*="btn"].is-clicked, 
#task-navigator-wrapper button[class*="nav-card"].is-clicked,
#task-navigator-wrapper input[class*="btn"].is-clicked, 
#task-navigator-wrapper input[class*="nav-card"].is-clicked,
#task-navigator-wrapper .task-square.is-clicked,
#task-navigator-wrapper .task-sq-unsolved.is-clicked,
#task-navigator-wrapper .task-sq-correct.is-clicked,
#task-navigator-wrapper .task-sq-wrong.is-clicked {
    pointer-events: none !important;
    box-shadow: none !important;
    filter: brightness(0.8) !important;
}

/* ==========================================================================
   КНОПКИ ПЕЧАТИ В НАВИГАТОРЕ ЗАДАНИЙ
========================================================================== */

#task-navigator-wrapper .rl-nav-print-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    padding: 10px !important;
    border-top: 2px solid #D7DCE2 !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
}

#task-navigator-wrapper .rl-nav-print-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 38px !important;
    padding: 8px 10px !important;
    background: #ffffff !important;
    color: #6B7280 !important;
    border: 2px solid #6B7280 !important;
    border-radius: 10px !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-align: center !important;
    text-decoration: none !important;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1) !important;
    transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s !important;
    box-sizing: border-box !important;
    -webkit-tap-highlight-color: transparent !important;
}

@media (hover: hover) {
    #task-navigator-wrapper .rl-nav-print-btn:hover {
        background: #E6E9ED !important;
        color: #202124 !important;
        border-color: #202124 !important;
        box-shadow: none !important;
    }
}

#task-navigator-wrapper .rl-nav-print-btn.is-clicked {
    pointer-events: none !important;
    filter: brightness(0.8) !important;
    box-shadow: none !important;
}

@media (max-width: 480px) {
    #task-navigator-wrapper .rl-nav-print-actions {
        grid-template-columns: 1fr !important;
    }
}