#viewport {
    transition: transform 320ms cubic-bezier(0.22, 0.61, 0.36, 1);
    will-change: transform, opacity;
}

#person-panel {
    will-change: opacity;
}

.family-tree.is-panning #viewport,
.family-tree.motion-direct-camera #viewport {
    transition: none !important;
}

.node.is-activating .node-card {
    stroke-width: 2.4px;
    filter: brightness(0.97);
}

@media (prefers-reduced-motion: reduce) {
    #viewport {
        transition: none !important;
    }

    .node.is-activating .node-card {
        stroke-width: inherit;
        filter: none;
    }
}