@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap');

:root {
    --black-shade: #000000;
    --white-shade: #FFFFFF;
    --gray-shade: #94a1b2;
    --blue-shade: #2A86FF;
}

body {
    font-family: 'Poppins', sans-serif;
}

/*  */

.node-circle {
    transition: transform 240ms cubic-bezier(.2, .8, .2, 1), r 240ms;
}

.node-text {
    font-weight: 600;
    pointer-events: none;
}

.edge-line {
    stroke-width: 2;
    stroke-linecap: round;
    transition: stroke 200ms;
}

.controls input[type=text] {
    outline: none;
}

/* Responsive SVG container keeps aspect ratio */
.svg-wrap {
    width: 100%;
    height: 60vh;
    min-height: 320px;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.02), rgba(99, 102, 241, 0.02));
    border-radius: 12px;
}

@media (max-width: 640px) {
    .svg-wrap {
        height: 56vh;
    }
}