/* Reglas para preservar alineación de texto con efectos */
    /* Caso 1: Div de alineación explícito (data-xioleni-align="true") */
    /* Estos divs son 'display: block' por defecto o por JS, y tienen width: 100% y text-align */
    div[data-xioleni-align="true"] > span[class*="xioleni-text-"] {
        /* El span interno debe ser inline-block para que el text-align del div padre funcione */
        /* y para que los efectos como typewriter calculen bien su ancho */
         display: inline-block; 
         /* white-space: nowrap; Solo necesario para efectos per-letra, aplicado en JS */
         max-width: 100%; /* Evitar desbordamientos */
         vertical-align: baseline; /* Ajustar si es necesario */
    }

    /* Caso 2: Efecto aplicado directamente dentro de un elemento ya alineado (sin div explícito) */
    /* Estas reglas son un fallback, menos probable con la nueva lógica JS */
    div[style*="text-align: center"] > span[class*="xioleni-text-"],
    p[style*="text-align: center"] > span[class*="xioleni-text-"],
    .xioleni-text-center > span[class*="xioleni-text-"],
    div[style*="text-align: right"] > span[class*="xioleni-text-"],
    p[style*="text-align: right"] > span[class*="xioleni-text-"],
    .xioleni-text-right > span[class*="xioleni-text-"],
    div[style*="text-align: justify"] > span[class*="xioleni-text-"],
    p[style*="text-align: justify"] > span[class*="xioleni-text-"],
    .xioleni-text-justify > span[class*="xioleni-text-"] {
         /* Si el span es hijo directo, necesita ser inline-block para respetar la alineación padre */
         display: inline-block; 
         max-width: 100%;
         vertical-align: baseline;
    }

    /* Asegurar que los spans de letras individuales dentro de efectos mantengan su display */
    span[class*="xioleni-text-"] span {
        /* Ya se aplica inline-block en JS donde es necesario (rain, reverse-fade, wave) */
    }

    /* Estilos específicos para typewriter (asegurar que funcionen dentro del div de alineación) */
    /* El div padre [data-xioleni-align] ya centra/alinea el bloque */
    /* El span typewriter interno ya es inline-block por la regla general anterior */
    /* Por lo tanto, no se necesitan márgenes auto aquí, la alineación del div padre es suficiente */

    /* Fallback para typewriter si NO está en div de alineación (menos probable ahora) */
    div[style*="text-align: center"] .xioleni-text-entrada-typewriter,
    p[style*="text-align: center"] .xioleni-text-entrada-typewriter,
    .xioleni-text-center .xioleni-text-entrada-typewriter,
    div[style*="text-align: center"] .xioleni-text-bucle-typewriter-loop,
    p[style*="text-align: center"] .xioleni-text-bucle-typewriter-loop,
    .xioleni-text-center .xioleni-text-bucle-typewriter-loop {
        /* Aquí sí puede necesitar margen auto porque el span es inline-block */
        margin-left: auto !important;
        margin-right: auto !important;
    }
    
    div[style*="text-align: right"] .xioleni-text-entrada-typewriter,
    p[style*="text-align: right"] .xioleni-text-entrada-typewriter,
    .xioleni-text-right .xioleni-text-entrada-typewriter,
    div[style*="text-align: right"] .xioleni-text-bucle-typewriter-loop,
    p[style*="text-align: right"] .xioleni-text-bucle-typewriter-loop,
    .xioleni-text-right .xioleni-text-bucle-typewriter-loop {
         /* Aquí sí puede necesitar margen auto porque el span es inline-block */
        margin-left: auto !important;
        margin-right: 0 !important;
    }

    /* Asegura que los contenedores de efectos respeten la alineación */
    [class*="xioleni-text-"] {
        display: inline-block !important;
        width: 100% !important;
    }

    .xioleni-post-content .xioleni-text-left, 
    .xioleni-post-content [style*="text-align: left"] {
        text-align: left !important;
    }

    /* Contenedor principal de efectos - Versión corregida */
    .xioleni-effect-container {
        display: inline !important;
        position: relative;
        line-height: normal !important;
    }

    /* Clases de alineación con máxima prioridad */
    .xioleni-align-left { text-align: left !important; }
    .xioleni-align-center { 
        text-align: center !important;
        display: block !important;
    }
    .xioleni-align-right { 
        text-align: right !important;
        display: block !important;
    }
    .xioleni-align-justify { 
        text-align: justify !important;
        display: block !important;
    }

    /* Efectos específicos que necesitan inline-block */
    .xioleni-text-entrada-typewriter,
    .xioleni-text-bucle-typewriter,
    .xioleni-text-entrada-rain {
        display: inline-block !important;
        vertical-align: top !important;
    }

    @keyframes xioleniRainEffect {
        from { transform: translateY(-20px); opacity: 0; }
        to { transform: translateY(0); opacity: 1; }
    }

    @keyframes xioleniTypewriterEffect {
        from { width: 0; }
        to { width: 100%; }
    }

    /* Clase base para TODOS los efectos */
    .xioleni-text-effect {
        display: inline !important;
        position: relative;
        unicode-bidi: plaintext; /* Preserva direccionalidad del texto */
        white-space: pre; /* Mantiene espacios intactos */
    }

    /* Contenedores de alineación INVISIBLES */
    .xioleni-align-helper {
        display: contents !important; /* Mágico: hace que el contenedor desaparezca */
    }

    /* Efectos por caracteres (rain, reverse-fade) */
    .xioleni-per-char-effect {
        display: inline-block !important;
        vertical-align: top !important;
        white-space: nowrap !important;
    }

    /* Reset de márgenes para elementos inline */
    [class*="xioleni-text-"] {
        margin: 0 !important;
        padding: 0 !important;
        line-height: inherit !important;
    }

    /* Contenedor para letras animadas */
    .xioleni-inline-container {
        display: inline !important;
        letter-spacing: normal !important;
        word-spacing: normal !important;
    }

    /* Estilo base para letras con efecto */
    .xioleni-char-effect {
        display: inline-block !important;
        position: relative;
        transform-origin: center center;
        backface-visibility: hidden;
        vertical-align: baseline !important;
        line-height: inherit !important;
    }

    /* Animaciones específicas para letras */
    @keyframes xioleniRainChar {
        from { transform: translateY(-30px); opacity: 0; }
        to { transform: translateY(0); opacity: 1; }
    }

    @keyframes xioleniReverseFadeChar {
        from { transform: translateY(10px); opacity: 0; }
        to { transform: translateY(0); opacity: 1; }
    }

    @keyframes xioleniSlideLeftChar {
        from { transform: translateX(-15px); opacity: 0; }
        to { transform: translateX(0); opacity: 1; }
    }

    @keyframes xioleniFadeInChar {
        from { opacity: 0; }
        to { opacity: 1; }
    }

    /* Asegurar que las letras no causen saltos de línea */
    [class^="xioleni-char-effect"], 
    [class*=" xioleni-char-effect"] {
        white-space: nowrap !important;
        word-break: keep-all !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .xioleni-effect-panel button {
        background-color: #660c46;
        font-size: 0.8em;
        padding: 8px;
    }

    /* ===== EFECTOS DE ENTRADA MEJORADOS - SEGURO ===== */
    /* (Agregar al final del CSS existente) */

    .xioleni-text-entrada-slide-left span,
    .xioleni-text-entrada-slide-right span,
    .xioleni-text-entrada-slide-up span, 
    .xioleni-text-entrada-slide-down span {
        display: inline !important;
        opacity: 0;
        animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
        animation-fill-mode: forwards;
        vertical-align: baseline !important;
        line-height: inherit !important;
    }

    .xioleni-text-entrada-slide-left span {
        animation-name: xioleniFixedSlideLeft;
        animation-duration: 1.2s;
    }

    .xioleni-text-entrada-slide-right span {
        animation-name: xioleniFixedSlideRight;
        animation-duration: 1.2s;
    }

    .xioleni-text-entrada-slide-up span {
        animation-name: xioleniFixedSlideUp;
        animation-duration: 1.2s;
    }

    .xioleni-text-entrada-slide-down span {
        animation-name: xioleniFixedSlideDown;
        animation-duration: 1.2s;
    }

    @keyframes xioleniFixedSlideLeft {
        0% { transform: translateX(-40px); opacity: 0; }
        70% { opacity: 0.7; }
        100% { transform: translateX(0); opacity: 1; }
    }

    @keyframes xioleniFixedSlideRight {
        0% { transform: translateX(40px); opacity: 0; }
        70% { opacity: 0.7; }
        100% { transform: translateX(0); opacity: 1; }
    }

    @keyframes xioleniFixedSlideUp {
        0% { transform: translateY(30px); opacity: 0; }
        70% { opacity: 0.7; }
        100% { transform: translateY(0); opacity: 1; }
    }

    @keyframes xioleniFixedSlideDown {
        0% { transform: translateY(-30px); opacity: 0; }
        70% { opacity: 0.7; }
        100% { transform: translateY(0); opacity: 1; }
    }

    /* Efecto máquina de escribir - Entrada */
    .xioleni-text-entrada-typewriter {
        display: inline-block !important;
        overflow: hidden;
        white-space: nowrap;
        border-right: 2px solid #fff;
        animation: xioleniTypewriter 3s steps(40) forwards;
        animation-timing-function: steps(1);
        vertical-align: top;
    }

    /* Efecto máquina de escribir - Bucle infinito */
    .xioleni-text-bucle-typewriter-loop {
        display: inline-block !important;
        overflow: hidden;
        white-space: nowrap;
        border-right: 2px solid #fff;
        animation: xioleniTypewriterLoop 6s steps(40) infinite;
        animation-timing-function: steps(1);
        vertical-align: top;
    }

    /* Cursor parpadeante para ambos efectos - ELIMINADO */
    
    /* Animaciones */
    @keyframes xioleniTypewriter {
        from { width: 0; }
        to { width: 100%; }
    }

    @keyframes xioleniTypewriterLoop {
        0% { width: 0; }
        40% { width: 100%; }
        60% { width: 100%; }
        100% { width: 0; }
    }

    @keyframes xioleniBlink {
        0%, 100% { opacity: 1; }
        50% { opacity: 0; }
    }

    /* Efectos de máquina de escribir mejorados */
    .xioleni-typewriter-container {
        display: inline-block;
        width: 100%;
        text-align: inherit;
    }

    .xioleni-text-entrada-typewriter, 
    .xioleni-text-bucle-typewriter-loop {
        display: inline-block;
        white-space: nowrap;
        overflow: hidden;
        vertical-align: top;
        position: relative;
    }

    .xioleni-text-entrada-typewriter {
        animation: xioleniTypewriter 3s steps(40) forwards;
    }

    .xioleni-text-bucle-typewriter-loop {
        animation: xioleniTypewriterLoop 6s steps(40) infinite;
    }

    .xioleni-typewriter-cursor {
        /* Cursor eliminado - implementar desde cero */
        display: none !important;
    }

    .xioleni-typewriter-char {
        display: inline-block;
        opacity: 0;
        animation: xioleniTypewriterChar 0.1s forwards;
    }

    @keyframes xioleniTypewriter {
        from { width: 0; }
        to { width: 100%; }
    }

    @keyframes xioleniTypewriterLoop {
        0% { width: 0; }
        40% { width: 100%; }
        60% { width: 100%; }
        100% { width: 0; }
    }

    @keyframes xioleniTypewriterChar {
        /* Animación eliminada - implementar desde cero */
    }

    @keyframes xioleniBlink {
        0%, 100% { opacity: 1; }
        50% { opacity: 0; }
    }

    /* Elimina el cursor de los efectos typewriter */
    .xioleni-text-entrada-typewriter::after,
    .xioleni-text-bucle-typewriter-loop::after {
        display: none !important;
    }

    /* Nuevo contenedor para máquina de escribir */
    .xioleni-typewriter-container {
        display: inline-block;
        position: relative;
    }

    /* Cursor personalizado */
    .xioleni-typewriter-cursor {
        /* Cursor eliminado - implementar desde cero */
        display: none !important;
    }

    /* Cursor dinámico */
    .xioleni-typewriter-cursor {
        /* Cursor eliminado - implementar desde cero */
        display: none !important;
    }

    /* Contenedor inline para mantener alineación */
    .xioleni-typewriter-container {
        display: inline-block;
        position: relative;
        vertical-align: top;
    }

    @keyframes xioleniReverseFadeChar {
        from { transform: translateY(10px); opacity: 0; }
        to { transform: translateY(0); opacity: 1; }
    }
    
    /* Efectos de máquina de escribir */
    .xioleni-text-entrada-typewriter,
    .xioleni-text-bucle-typewriter-loop {
        display: inline-block !important;
        overflow: hidden;
        white-space: nowrap;
        vertical-align: bottom;
        animation: none !important; /* Desactivar animaciones CSS para controlarlas con JS */
    }

    /* Contenedor de efectos - asegura que no cause saltos de línea */
    .xioleni-effect-container {
        display: inline !important;
        unicode-bidi: plaintext;
        line-height: normal !important;
    }

    /* Clases de alineación que prevalecen sobre los efectos */
    .xioleni-align-left { text-align: left !important; }
    .xioleni-align-center { text-align: center !important; }
    .xioleni-align-right { text-align: right !important; }
    .xioleni-align-justify { text-align: justify !important; }

    /* Reset para elementos inline */
    [class*="xioleni-text-"] {
        margin: 0 !important;
        padding: 0 !important;
        line-height: inherit !important;
    }
    
    /* Animaciones para efectos */
    @keyframes xioleniRainChar {
        from { transform: translateY(-30px); opacity: 0; }
        to { transform: translateY(0); opacity: 1; }
    }

    @keyframes xioleniReverseFadeChar {
        from { transform: translateY(10px); opacity: 0; }
        to { transform: translateY(0); opacity: 1; }
    }

    @keyframes xioleniSlideLeft {
        from { transform: translateX(-50px); opacity: 0; }
        to { transform: translateX(0); opacity: 1; }
    }

    @keyframes xioleniSlideRight {
        from { transform: translateX(50px); opacity: 0; }
        to { transform: translateX(0); opacity: 1; }
    }

    @keyframes xioleniSlideUp {
        from { transform: translateY(20px); opacity: 0; }
        to { transform: translateY(0); opacity: 1; }
    }

    @keyframes xioleniSlideDown {
        from { transform: translateY(-20px); opacity: 0; }
        to { transform: translateY(0); opacity: 1; }
    }

    @keyframes xioleniFadeIn {
        from { opacity: 0; }
        to { opacity: 1; }
    }

    /* ===== EFECTO MÁQUINA DE ESCRIBIR - VERSIÓN CORREGIDA ===== */
    .xioleni-tw-container {
        display: inline !important;
        position: relative;
        unicode-bidi: plaintext;
    }

    .xioleni-tw-effect {
        display: inline-block !important;
        overflow: hidden;
        white-space: nowrap;
        vertical-align: bottom;
        animation-timing-function: steps(1, end);
        border: none !important; /* Eliminar cualquier borde */
    }

    .xioleni-tw-effect.entrada {
        animation: xioleni-tw-typing 3s forwards;
    }

    .xioleni-tw-effect.bucle {
        animation: xioleni-tw-typing-loop 6s infinite;
    }

    .xioleni-tw-cursor {
        display: inline-block;
        width: 2px;
        height: 1em;
        background: #fff;
        animation: xioleni-tw-blink 0.7s infinite;
        vertical-align: bottom;
        margin-left: 2px;
    }

    @keyframes xioleni-tw-typing {
        from { 
            width: 0;
            visibility: hidden;
        }
        to { 
            width: 100%;
            visibility: visible;
        }
    }

    @keyframes xioleni-tw-typing-loop {
        0% { 
            width: 0;
            visibility: hidden;
        }
        40% { 
            width: 100%;
            visibility: visible;
        }
        60% { 
            width: 100%;
            visibility: visible;
        }
        100% { 
            width: 0;
            visibility: hidden;
        }
    }

    @keyframes xioleni-tw-blink {
        0%, 100% { opacity: 1 }
        50% { opacity: 0 }
    }

    /* Reset para evitar conflictos */
    [class*="xioleni-text-typewriter"],
    [class*="typewriter"] {
        all: unset !important;
        display: inline !important;
        animation: none !important;
        border: none !important;
    }

    /* Eliminar todos los estilos antiguos de typewriter */
    .xioleni-text-entrada-typewriter,
    .xioleni-text-bucle-typewriter-loop,
    [class*="xioleni-text-typewriter"],
    [class*="typewriter"],
    [class*="xioleni-text-typewriter"]::after,
    [class*="typewriter"]::after {
        all: unset !important;
        display: inline !important;
        animation: none !important;
        border: none !important;
    }
    
    /* Nuevos estilos para el efecto typewriter mejorado */
    .xioleni-tw-container {
        display: inline !important;
        position: relative;
        unicode-bidi: plaintext;
        line-height: normal !important;
    }
    
    .xioleni-tw-effect {
        display: inline-block !important;
        overflow: hidden;
        white-space: nowrap;
        vertical-align: bottom;
        animation-timing-function: steps(1, end);
    }
    
    .xioleni-tw-effect.entrada {
        animation: xioleni-tw-typing 3s forwards;
    }
    
    .xioleni-tw-effect.bucle {
        animation: xioleni-tw-typing-loop 6s infinite;
    }
    
    /* Eliminar completamente el cursor */
    .xioleni-tw-cursor {
        display: none !important;
    }
    
    @keyframes xioleni-tw-typing {
        from { 
            width: 0;
            visibility: hidden;
        }
        to { 
            width: 100%;
            visibility: visible;
        }
    }
    
    @keyframes xioleni-tw-typing-loop {
        0% { 
            width: 0;
            visibility: hidden;
        }
        40% { 
            width: 100%;
            visibility: visible;
        }
        60% { 
            width: 100%;
            visibility: visible;
        }
        100% { 
            width: 0;
            visibility: hidden;
        }
    }

    /* Eliminar todos los estilos antiguos de typewriter (incluyendo los añadidos previamente) */
    /* .xioleni-text-entrada-typewriter, .xioleni-text-bucle-typewriter-loop, [class*="typewriter"], .xioleni-tw-container, .xioleni-tw-effect, .xioleni-tw-cursor, etc. YA NO SE USAN */

    /* CONTENEDOR PRINCIPAL (INVISIBLE) */
    .xioleni-tw-master-container {
        display: inline !important;
        position: relative;
        unicode-bidi: plaintext;
    }

    /* CONTENEDOR DE EFECTO (MANEJA LA ANIMACIÓN) */
    .xioleni-tw-effect-container {
        display: inline-block !important;
        position: relative;
        vertical-align: bottom !important;
        overflow: hidden;
        white-space: nowrap;
    }

    /* ANIMACIÓN DE ENTRADA */
    .xioleni-tw-effect-entrada {
        animation: xioleni-tw-typing 3s steps(40, end) forwards;
    }

    /* ANIMACIÓN DE BUCLE */
    .xioleni-tw-effect-bucle {
        animation: xioleni-tw-typing-loop 6s steps(40, end) infinite;
    }

    /* KEYFRAMES OPTIMIZADOS */
    @keyframes xioleni-tw-typing {
        from { width: 0 }
        to { width: 100% }
    }

    @keyframes xioleni-tw-typing-loop {
        0% { width: 0 }
        40% { width: 100% }
        60% { width: 100% }
        100% { width: 0 }
    }

    /* ===== FIN: CSS TYPEWRITER VERSIÓN FIJA ===== */

    /* ===== INICIO: CSS TYPEWRITER VERSIÓN FINAL ===== */
    /* Asegurarse de eliminar cualquier CSS anterior de typewriter (.xioleni-tw-..., .xioleni-fixed-..., etc.) */

    /* ESTILOS PARA EL EFECTO TYPEWRITER MEJORADO */
    .xioleni-final-typewriter {
        display: inline !important; /* Contenedor principal debe ser inline */
        position: relative;
        unicode-bidi: plaintext;
        letter-spacing: normal !important; /* Heredar o normalizar espaciado */
        line-height: inherit !important; /* Heredar interlineado */
        text-align: inherit !important; /* Heredar alineación */
    }

    .xioleni-final-effect {
        display: inline-block !important; /* El efecto necesita ser inline-block */
        vertical-align: baseline !important; /* Alineación vertical consistente */
        overflow: hidden; /* Oculta el texto que aún no se revela */
        white-space: nowrap; /* Evita saltos de línea dentro del efecto */
        animation-timing-function: steps(1, end); /* Muestra letra por letra */
        max-width: 100%; /* Evita desbordamiento */
        width: auto; /* Permitir que el ancho se ajuste al contenido */
        border: none !important; /* Eliminar cualquier borde */
    }

    .xioleni-final-entrada {
        animation: xioleni-final-typing 3s forwards; /* Animación de entrada */
    }

    .xioleni-final-bucle {
        animation: xioleni-final-typing-loop 6s infinite; /* Animación en bucle */
    }

    @keyframes xioleni-final-typing {
        from { 
            width: 0;
            min-width: 0; /* Asegurar que empiece desde cero */
        }
        to { 
            width: 100%; /* Animar hasta el ancho completo del contenido */
            min-width: 0;
        }
    }

    @keyframes xioleni-final-typing-loop {
        0% { 
            width: 0;
            min-width: 0;
        }
        40% { 
            width: 100%; 
            min-width: 0;
        }
        60% { 
            width: 100%;
            min-width: 0;
        }
        100% { 
            width: 0;
            min-width: 0;
        }
    }

    /* PROTECCIÓN PARA ALINEACIONES (Aplicado al contenedor principal) */
    /* .xioleni-final-typewriter hereda line-height y text-align */

    /* ===== FIN: CSS TYPEWRITER VERSIÓN FINAL ===== */

    /* ===== INICIO: CSS EFECTOS DE INTERACCIÓN MEJORADOS ===== */
    /* Efectos de interacción para texto */
    .xioleni-text-interaccion-zoom {
        display: inline-block !important;
        transition: transform 0.3s ease !important;
        transform-origin: center center !important;
        vertical-align: baseline !important;
    }

    .xioleni-text-interaccion-zoom:hover {
        transform: scale(1.1) !important;
        z-index: 1; /* Evitar superposición con otros elementos */
    }

    .xioleni-text-interaccion-shake {
        display: inline-block !important;
        transition: transform 0.1s ease !important;
        transform-origin: center center !important;
    }

    .xioleni-text-interaccion-shake:hover {
        animation: xioleniShake 0.5s infinite !important;
    }

    .xioleni-text-interaccion-pulse {
        display: inline-block !important;
        transform-origin: center center !important;
    }

    .xioleni-text-interaccion-pulse:hover {
        animation: xioleniPulse 1s ease-in-out infinite !important;
    }

    .xioleni-text-interaccion-rotate {
        display: inline-block !important;
        transition: transform 0.3s ease !important;
        transform-origin: center center !important;
    }

    .xioleni-text-interaccion-rotate:hover {
        animation: xioleniRotate 2s linear infinite !important;
    }

    .xioleni-text-interaccion-expand {
        display: inline-block !important;
        transition: letter-spacing 0.3s ease !important;
    }

    .xioleni-text-interaccion-expand:hover {
        letter-spacing: 2px !important;
    }

    /* Definición de las animaciones */
    @keyframes xioleniShake {
        0%, 100% { transform: translateX(0) rotate(0); }
        10%, 30%, 50%, 70%, 90% { transform: translateX(-3px) rotate(-1deg); }
        20%, 40%, 60%, 80% { transform: translateX(3px) rotate(1deg); }
    }

    @keyframes xioleniPulse {
        0%, 100% { transform: scale(1); }
        50% { transform: scale(1.1); }
    }

    @keyframes xioleniRotate {
        0% { transform: rotate(0deg); }
        100% { transform: rotate(360deg); }
    }

    /* Efectos de bucle */
    .xioleni-text-bucle-pulse {
        display: inline !important;
        vertical-align: baseline !important;
        line-height: inherit !important;
        animation: xioleniPulse 1.5s ease-in-out infinite !important;
        transform-origin: center center !important;
    }

    /* Efecto de brillo en bucle - adaptable al color del texto */
    .xioleni-text-bucle-brillo {
        display: inline !important;
        vertical-align: baseline !important;
        line-height: inherit !important;
        animation: xioleniBrilloBucle 2s ease-in-out infinite !important;
        transform-origin: center center !important;
        /* El color se hereda del texto, el brillo se adapta */
        filter: brightness(1.2) drop-shadow(0 0 8px currentColor);
    }

    @keyframes xioleniBrilloBucle {
        0%, 100% { 
            filter: brightness(1.2) drop-shadow(0 0 8px currentColor) drop-shadow(0 0 12px currentColor);
            opacity: 1;
        }
        50% { 
            filter: brightness(1.5) drop-shadow(0 0 15px currentColor) drop-shadow(0 0 25px currentColor);
            opacity: 0.9;
        }
    }

    /* Balanceo suave - funciona como palpitar y girar sin causar saltos */
    .xioleni-text-bucle-swing {
        display: inline !important;
        vertical-align: baseline !important;
        line-height: inherit !important;
        animation: xioleniBalanceoSuave 2s ease-in-out infinite !important;
        transform-origin: center center !important;
    }

    @keyframes xioleniBalanceoSuave {
        0%, 100% { 
            transform: rotate(-3deg);
        }
        50% { 
            transform: rotate(3deg);
        }
    }

    .xioleni-text-bucle-wave {
        display: inline !important;
        vertical-align: baseline !important;
        line-height: inherit !important;
        white-space: normal !important;
    }

    .xioleni-text-bucle-wave span {
        display: inline-block !important;
        vertical-align: baseline !important;
        line-height: inherit !important;
        animation: xioleniWaveChar 2s ease-in-out infinite;
        animation-delay: calc(0.1s * var(--xioleni-char-index, 0));
        transform-origin: bottom center;
    }

    @keyframes xioleniWaveChar {
        0%, 100% { transform: translateY(0); }
        50% { transform: translateY(-0.3em); }
    }

    .xioleni-text-bucle-spin {
        display: inline !important;
        vertical-align: baseline !important;
        line-height: inherit !important;
        animation: xioleniSpin 4s linear infinite !important;
        transform-origin: center center !important;
    }

    @keyframes xioleniSpin {
        0% { transform: rotate(0deg); }
        100% { transform: rotate(360deg); }
    }

    /* Asegurar que los efectos de interacción respeten la alineación */
    [class*="xioleni-text-interaccion-"] {
        display: inline-block !important;
        vertical-align: baseline !important;
        line-height: inherit !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Compatibilidad con alineación */
    .xioleni-effect-container {
        display: inline !important;
        position: relative;
        line-height: normal !important;
        text-align: inherit !important;
    }

    [class*="xioleni-text-"] {
        text-align: inherit !important;
        vertical-align: baseline !important;
    }

    .xioleni-text-left { text-align: left !important; }
    .xioleni-text-center { text-align: center !important; }
    .xioleni-text-right { text-align: right !important; }
    .xioleni-text-justify { text-align: justify !important; }

    /* Estilos para efectos de interacción de texto mejorados */
    .xioleni-text-interaccion-glow:hover {
        text-shadow: 0 0 10px rgba(255, 255, 255, 0.7), 0 0 20px rgba(255, 215, 0, 0.5);
        color: #ffcc00;
        transition: all 0.3s ease;
    }

    .xioleni-text-interaccion-blur:hover {
        color: transparent;
        text-shadow: 0 0 5px rgba(0, 0, 0, 0.8);
        transition: all 0.3s ease;
    }

    .xioleni-text-interaccion-rainbow:hover {
        background-image: linear-gradient(90deg, red, orange, yellow, green, blue, indigo, violet);
        background-clip: text;
        -webkit-background-clip: text;
        color: transparent;
        transition: all 0.3s ease;
    }

    .xioleni-text-interaccion-rotate:hover {
        transform: rotate(5deg);
        display: inline-block;
        transition: transform 0.3s ease;
    }

    .xioleni-text-interaccion-expand:hover {
        letter-spacing: 2px;
        transition: letter-spacing 0.3s ease;
    }

    /* Compatibilidad con alineación */
    .xioleni-align-helper {
        display: inline-block;
        width: 100%;
    }

    .xioleni-text-effect {
        width: auto;
        display: inline-block;
    }
    
    /* Animaciones adicionales para nuevos efectos */
    @keyframes xioleniColorShift {
        0% { color: red; }
        25% { color: yellow; }
        50% { color: blue; }
        75% { color: green; }
        100% { color: red; }
    }
    
    @keyframes xioleniGlow {
        0%, 100% { text-shadow: 0 0 5px rgba(255, 255, 255, 0.5), 0 0 10px rgba(255, 215, 0, 0.3); }
        50% { text-shadow: 0 0 15px rgba(255, 255, 255, 0.8), 0 0 25px rgba(255, 215, 0, 0.6); }
    }
    
    @keyframes xioleniExpand {
        0%, 100% { letter-spacing: normal; }
        50% { letter-spacing: 3px; }
    }

    /* ESTILOS PARA MANTENER TEXTO UNIDO */
    .xioleni-effect-container {
        display: inline !important;
        position: relative;
        line-height: normal !important;
        white-space: nowrap;
    }

    .xioleni-text-effect {
        display: inline !important;
        position: relative;
        unicode-bidi: plaintext;
        letter-spacing: normal !important;
    }

    /* Efectos por caracteres */
    .xioleni-per-char-effect {
        display: inline !important;
    }

    .xioleni-char-effect {
        display: inline-block !important;
        position: relative;
        transform-origin: center center;
        backface-visibility: hidden;
        vertical-align: baseline !important;
        line-height: inherit !important;
    }

    /* Reset de márgenes para elementos inline */
    [class*="xioleni-text-"] {
        margin: 0 !important;
        padding: 0 !important;
        line-height: inherit !important;
    }

    /* Contenedor para letras animadas */
    .xioleni-inline-container {
        display: inline !important;
        letter-spacing: normal !important;
        word-spacing: normal !important;
    }
    
    @keyframes xioleniRainChar {
        from { transform: translateY(-30px); opacity: 0; }
        to { transform: translateY(0); opacity: 1; }
    }

    @keyframes xioleniReverseFadeChar {
        from { transform: translateY(10px); opacity: 0; }
        to { transform: translateY(0); opacity: 1; }
    }

    @keyframes xioleniWaveChar {
        0%, 100% { transform: translateY(0); }
        50% { transform: translateY(-5px); }
    }

    @keyframes xioleniPulse {
        0%, 100% { transform: scale(1); }
        50% { transform: scale(1.05); }
    }

    @keyframes xioleniSwing {
        0%, 100% { transform: rotate(-5deg); }
        50% { transform: rotate(5deg); }
    }

    @keyframes xioleniSpin {
        from { transform: rotate(0deg); }
        to { transform: rotate(360deg); }
    }

    @keyframes xioleniShake {
        0%, 100% { transform: translateX(0); }
        25% { transform: translateX(-5px); }
        75% { transform: translateX(5px); }
    }

    @keyframes xioleniShake {
        0%, 100% { transform: translateX(0); }
        25% { transform: translateX(-5px); }
        75% { transform: translateX(5px); }
    }