/* Диаграммы матриц судьбы - общие стили для всех типов */

.diagram-section-full {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

#diagram-container {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    /* ВАЖНО: Скрываем диаграмму по умолчанию до применения блюра для предотвращения мигания */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.1s ease-in-out, visibility 0.1s ease-in-out;
}

/* Показываем диаграмму только после инициализации блюра */
#diagram-container.diagram-ready {
    opacity: 1;
    visibility: visible;
}

#diagram-container svg {
    position: relative;
    z-index: 1;
    width: 100%;
    height: auto;
    padding: 0;
    margin: 0;
    display: block;
    box-sizing: border-box;
}

.diagram-wrapper {
    width: 100%;
    aspect-ratio: 1 / 1;
    position: relative;
    margin: 0;
    padding: 0;
    display: block;
    line-height: 0;
    box-sizing: border-box;
}

.diagram-wrapper svg {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    display: block;
    vertical-align: top;
    box-sizing: border-box;
}

/* Увеличение диаграмм внутри контейнера - убираем отступы (кроме главной матрицы) */
.diagram-wrapper-child svg {
    transform: scale(1.1);
    transform-origin: center;
}

.diagram-wrapper-relationship svg,
.diagram-wrapper-career svg {
    transform: scale(1.15);
    transform-origin: center;
}

@media (min-width: 1025px) {
    .diagram-wrapper-block {
        transform: scale(0.9);
        transform-origin: center;
    }
    
    /* Компенсируем масштабирование для кнопок на блюре, чтобы они оставались 100% */
    .diagram-wrapper-block .diagram-blur-overlay,
    .diagram-wrapper-block .destiny-table-blur-overlay,
    .diagram-wrapper-block .health-map-blur-overlay {
        transform: scale(1.111111); /* 1 / 0.9 = 1.111111 для компенсации */
        transform-origin: center;
    }
    
    /* Увеличение диаграмм на десктопе (кроме главной матрицы) */
    .diagram-wrapper-child svg {
        transform: scale(1.1);
        transform-origin: center;
    }
    
    .diagram-wrapper-relationship svg,
    .diagram-wrapper-career svg {
        transform: scale(1.15);
        transform-origin: center;
    }
}

@media (max-width: 768px) {
    #diagram-container svg {
        max-height: 48vh;
    }
}

/* Размытие текста превью */
.blur-gradient {
    display: inline;
    filter: blur(5px);
    user-select: none;
    color: rgba(226, 232, 240, 0.6);
    pointer-events: none;
}