/* Joy动态按钮样式 */
.zaj-dynamic-btn {
    display: inline-block;
    padding: 12px 28px;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease;
    cursor: pointer;
    text-align: center;
    border: none;
    color: #fff;
}

.zaj-dynamic-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
    text-decoration: none;
    color: #fff;
}

/* 颜色主题 */
.zaj-btn-primary {
    background: linear-gradient(135deg, #4F46E5 0%, #7C3AED 100%);
}

.zaj-btn-success {
    background: linear-gradient(135deg, #059669 0%, #34D399 100%);
}

.zaj-btn-danger {
    background: linear-gradient(135deg, #DC2626 0%, #F87171 100%);
}

.zaj-btn-warning {
    background: linear-gradient(135deg, #D97706 0%, #FBBF24 100%);
}

.zaj-btn-ocean {
    background: linear-gradient(135deg, #0EA5E9 0%, #6366F1 100%);
}

.zaj-btn-neon {
    background: linear-gradient(135deg, #8B5CF6 0%, #EC4899 100%);
}

.zaj-btn-mint {
    background: linear-gradient(135deg, #14B8A6 0%, #06B6D4 100%);
}

.zaj-btn-carbon {
    background: linear-gradient(135deg, #1F2937 0%, #4B5563 100%);
}

.zaj-btn-sakura {
    background: linear-gradient(135deg, #EC4899 0%, #F9A8D4 100%);
}

.zaj-btn-sunset {
    background: linear-gradient(135deg, #F97316 0%, #FB923C 100%);
}

.zaj-btn-forest {
    background: linear-gradient(135deg, #047857 0%, #10B981 100%);
}

.zaj-btn-sky {
    background: linear-gradient(135deg, #38BDF8 0%, #7DD3FC 100%);
}

.zaj-btn-grape {
    background: linear-gradient(135deg, #7C3AED 0%, #A78BFA 100%);
}

.zaj-btn-lemon {
    background: linear-gradient(135deg, #EAB308 0%, #FDE047 100%);
}

.zaj-btn-rosegold {
    background: linear-gradient(135deg, #F59E0B 0%, #FCA5A5 100%);
}

.zaj-btn-midnight {
    background: linear-gradient(135deg, #1E3A8A 0%, #3B82F6 100%);
}

.zaj-btn-coral {
    background: linear-gradient(135deg, #FB7185 0%, #FDBA74 100%);
}

.zaj-btn-lavender {
    background: linear-gradient(135deg, #A78BFA 0%, #C4B5FD 100%);
}

.zaj-btn-emerald {
    background: linear-gradient(135deg, #10B981 0%, #6EE7B7 100%);
}

.zaj-btn-flame {
    background: linear-gradient(135deg, #EF4444 0%, #F97316 100%);
}

/* 动画：呼吸放大 */
@keyframes zaj-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

.zaj-anim-pulse {
    animation: zaj-pulse 2s ease-in-out infinite;
}

.zaj-anim-pulse:hover {
    animation: none;
}

/* 动画：左右微晃 */
@keyframes zaj-shake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-5px); }
    75% { transform: translateX(5px); }
}

.zaj-anim-shake {
    animation: zaj-shake 1.5s ease-in-out infinite;
}

.zaj-anim-shake:hover {
    animation: none;
}

/* 动画：流光扫过 */
@keyframes zaj-shimmer {
    0% { background-position: -200% center; }
    100% { background-position: 200% center; }
}

.zaj-anim-shimmer {
    background-size: 200% auto;
    animation: zaj-shimmer 3s linear infinite;
}

.zaj-anim-shimmer:hover {
    animation: zaj-shimmer 1.5s linear infinite;
}

/* 动画：弹跳 */
@keyframes zaj-bounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}

.zaj-anim-bounce {
    animation: zaj-bounce 1.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite;
}

.zaj-anim-bounce:hover {
    animation: none;
}

/* 动画：光晕脉冲 */
@keyframes zaj-glow {
    0%, 100% { box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15), 0 0 0 0 rgba(255, 255, 255, 0.4); }
    50% { box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15), 0 0 20px 10px rgba(255, 255, 255, 0.2); }
}

.zaj-anim-glow {
    animation: zaj-glow 2s ease-in-out infinite;
}

.zaj-anim-glow:hover {
    animation: none;
}

/* 动画：果冻弹性 */
@keyframes zaj-jelly {
    0%, 100% { transform: scale(1, 1); }
    25% { transform: scale(1.05, 0.95); }
    50% { transform: scale(0.95, 1.05); }
    75% { transform: scale(1.02, 0.98); }
}

.zaj-anim-jelly {
    animation: zaj-jelly 1.5s ease-in-out infinite;
}

.zaj-anim-jelly:hover {
    animation: none;
}

/* 动画：旋转脉冲 */
@keyframes zaj-rotate-pulse {
    0%, 100% { transform: rotate(0deg) scale(1); }
    25% { transform: rotate(-3deg) scale(1.03); }
    75% { transform: rotate(3deg) scale(1.03); }
}

.zaj-anim-rotate-pulse {
    animation: zaj-rotate-pulse 2s ease-in-out infinite;
}

.zaj-anim-rotate-pulse:hover {
    animation: none;
}

/* 动画：霓虹闪烁 */
@keyframes zaj-neon-blink {
    0%, 100% { box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15), 0 0 10px rgba(139, 92, 246, 0.5); }
    50% { box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15), 0 0 25px rgba(139, 92, 246, 0.8), 0 0 40px rgba(139, 92, 246, 0.4); }
}

.zaj-anim-neon-blink {
    animation: zaj-neon-blink 1.5s ease-in-out infinite;
}

.zaj-anim-neon-blink:hover {
    animation: none;
}

/* 动画：波浪涌动 */
@keyframes zaj-wave {
    0%, 100% { transform: skewX(0deg); }
    25% { transform: skewX(-5deg); }
    75% { transform: skewX(5deg); }
}

.zaj-anim-wave {
    animation: zaj-wave 2s ease-in-out infinite;
}

.zaj-anim-wave:hover {
    animation: none;
}

/* 动画：3D翻转 */
@keyframes zaj-flip-3d {
    0%, 100% { transform: perspective(400px) rotateY(0deg); }
    50% { transform: perspective(400px) rotateY(180deg); }
}

.zaj-anim-flip-3d {
    animation: zaj-flip-3d 2.5s ease-in-out infinite;
}

.zaj-anim-flip-3d:hover {
    animation: none;
}

/* 动画：磁悬浮 */
@keyframes zaj-levitate {
    0%, 100% { transform: translateY(0); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); }
    50% { transform: translateY(-8px); box-shadow: 0 12px 20px rgba(0, 0, 0, 0.25); }
}

.zaj-anim-levitate {
    animation: zaj-levitate 2.5s ease-in-out infinite;
}

.zaj-anim-levitate:hover {
    animation: none;
}

/* 动画：边框流光 */
@keyframes zaj-border-flow {
    0% { filter: hue-rotate(0deg); }
    100% { filter: hue-rotate(360deg); }
}

.zaj-anim-border-flow {
    position: relative;
    animation: zaj-border-flow 3s linear infinite;
}

.zaj-anim-border-flow:hover {
    animation: zaj-border-flow 1.5s linear infinite;
}

/* 动画：心跳 */
@keyframes zaj-heartbeat {
    0%, 100% { transform: scale(1); }
    10%, 30% { transform: scale(1.1); }
    20%, 40% { transform: scale(1); }
}

.zaj-anim-heartbeat {
    animation: zaj-heartbeat 1s ease-in-out infinite;
}

.zaj-anim-heartbeat:hover {
    animation: none;
}

/* 动画：摇摆 */
@keyframes zaj-swing {
    0%, 100% { transform: rotate(0deg); }
    20% { transform: rotate(15deg); }
    40% { transform: rotate(-10deg); }
    60% { transform: rotate(5deg); }
    80% { transform: rotate(-5deg); }
}

.zaj-anim-swing {
    transform-origin: top center;
    animation: zaj-swing 2s ease-in-out infinite;
}

.zaj-anim-swing:hover {
    animation: none;
}

/* 动画：闪烁 */
@keyframes zaj-blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

.zaj-anim-blink {
    animation: zaj-blink 1.5s ease-in-out infinite;
}

.zaj-anim-blink:hover {
    animation: none;
}

/* 动画：滑动 */
@keyframes zaj-slide {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(10px); }
}

.zaj-anim-slide {
    animation: zaj-slide 2s ease-in-out infinite;
}

.zaj-anim-slide:hover {
    animation: none;
}

/* 动画：缩放脉冲 */
@keyframes zaj-zoom-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

.zaj-anim-zoom-pulse {
    animation: zaj-zoom-pulse 1.5s ease-in-out infinite;
}

.zaj-anim-zoom-pulse:hover {
    animation: none;
}

/* 动画：彩虹流光 */
@keyframes zaj-rainbow {
    0% { filter: hue-rotate(0deg); }
    100% { filter: hue-rotate(360deg); }
}

.zaj-anim-rainbow {
    animation: zaj-rainbow 3s linear infinite;
}

.zaj-anim-rainbow:hover {
    animation: zaj-rainbow 1.5s linear infinite;
}

/* 动画：震动 */
@keyframes zaj-vibrate {
    0%, 100% { transform: translate(0, 0); }
    10% { transform: translate(-2px, -2px); }
    20% { transform: translate(2px, 2px); }
    30% { transform: translate(-2px, 2px); }
    40% { transform: translate(2px, -2px); }
    50% { transform: translate(-2px, -2px); }
    60% { transform: translate(2px, 2px); }
    70% { transform: translate(-2px, 2px); }
    80% { transform: translate(2px, -2px); }
    90% { transform: translate(-2px, -2px); }
}

.zaj-anim-vibrate {
    animation: zaj-vibrate 0.5s ease-in-out infinite;
}

.zaj-anim-vibrate:hover {
    animation: none;
}

/* 动画：呼吸光晕 */
@keyframes zaj-breath-glow {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15), 0 0 0 0 rgba(255, 255, 255, 0.4);
    }
    50% {
        transform: scale(1.05);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15), 0 0 30px 15px rgba(255, 255, 255, 0.3);
    }
}

.zaj-anim-breath-glow {
    animation: zaj-breath-glow 2.5s ease-in-out infinite;
}

.zaj-anim-breath-glow:hover {
    animation: none;
}

/* 居中包裹容器 */
.zaj-dynamic-btn-wrap {
    text-align: center;
    margin: 1em 0;
}

/* 编辑器预览样式 */
.zaj-block-preview {
    padding: 20px;
    text-align: center;
    background: #f5f5f5;
    border-radius: 4px;
}