/* Native disclosure faces own their animation. Never rotate their wrapper:
 * the legacy hover rotation would mirror the active face a second time. */
.calculus-content-builder .cb-flip-box[data-cb-flip-box-native="1"] > .cb-flip-box__inner,
.calculus-content-builder .cb-flip-box[data-cb-flip-box-native="1"]:hover > .cb-flip-box__inner,
.calculus-content-builder .cb-flip-box[data-cb-flip-box-native="1"]:focus-within > .cb-flip-box__inner {
    transform: none;
    transform-style: flat;
    transition: none;
}

.calculus-content-builder .cb-flip-box[data-cb-flip-box-native="1"] {
    perspective: 1400px;
}

.calculus-content-builder .cb-flip-box[data-cb-flip-box-native="1"][data-cb-flip-touched="1"]:not([data-cb-flip-static]) .cb-flip-box__front,
.calculus-content-builder .cb-flip-box[data-cb-flip-box-native="1"][data-cb-flip-touched="1"]:not([data-cb-flip-static]) .cb-flip-box__back {
    animation-timing-function: cubic-bezier(.2, .65, .3, 1);
}

/* Keep incoming text facing the reader throughout the reveal. Direction
 * and the configured duration remain author-controlled. */
.calculus-content-builder .cb-flip-box[data-cb-flip-box-native="1"][data-cb-flip-touched="1"][data-cb-flip-effect="flip"][data-cb-flip-active-face="front"] > .cb-flip-box__inner > .cb-flip-box__front,
.calculus-content-builder .cb-flip-box[data-cb-flip-box-native="1"][data-cb-flip-touched="1"][data-cb-flip-effect="flip"][data-cb-flip-active-face="back"] > .cb-flip-box__inner > .cb-flip-box__disclosure > .cb-flip-box__back {
    animation-name: cb-flip-gentle;
}

.calculus-content-builder .cb-flip-box[data-cb-flip-box-native="1"][data-cb-flip-touched="1"][data-cb-flip-effect="flip_3d"][data-cb-flip-active-face="front"] > .cb-flip-box__inner > .cb-flip-box__front,
.calculus-content-builder .cb-flip-box[data-cb-flip-box-native="1"][data-cb-flip-touched="1"][data-cb-flip-effect="flip_3d"][data-cb-flip-active-face="back"] > .cb-flip-box__inner > .cb-flip-box__disclosure > .cb-flip-box__back {
    animation-name: cb-flip-gentle-3d;
}

@keyframes cb-flip-gentle {
    from { opacity: 0; transform: rotateX(calc(var(--cb-flip-x) * .12)) rotateY(calc(var(--cb-flip-y) * .12)); }
    to { opacity: 1; transform: none; }
}

@keyframes cb-flip-gentle-3d {
    from { opacity: 0; transform: translateZ(-10px) rotateX(calc(var(--cb-flip-x) * .08)) rotateY(calc(var(--cb-flip-y) * .08)); }
    to { opacity: 1; transform: none; }
}