
.stap-container {
    display: inline-flex;
    flex-wrap: wrap;
    line-height: 1.2;
}

.stap-char {
    display: inline-block;
    transition: color 0.3s ease;
}

/* Effect: Grow */
@keyframes stap-grow {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(var(--stap-scale)); color: var(--stap-high); }
}

.stap-effect-grow .stap-char-active {
    animation: stap-grow var(--stap-dur) infinite ease-in-out;
}

/* Effect: Unmix (Fade and Slide) */
.stap-effect-unmix .stap-char {
    opacity: 0;
    transform: translateY(30px) rotate(25deg);
    transition: all var(--stap-dur) cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.stap-effect-unmix .stap-char.revealed {
    opacity: 1;
    transform: translateY(0) rotate(0deg);
}

/* Effect: Float */
@keyframes stap-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-15px); }
}

.stap-effect-float .stap-char-active {
    animation: stap-float var(--stap-dur) infinite ease-in-out;
}
