/* 正方形样式+动画（蓝紫渐变，质感拉满） */
.square {
    position: absolute;
    width: 30vw; 
    height: 30vw;
    background: linear-gradient(135deg, rgba(100, 149, 237, 0.85), rgba(153, 50, 204, 0.7));
    backdrop-filter: blur(8px);
    border-radius: 4vw;
    border: 0.3vw solid rgba(255, 255, 255, 0.3);
    outline: 0.5vw solid rgba(186, 85, 211, 0.4);
    outline-offset: 0.2vw;
    box-shadow: 
        0 0 5vw rgba(123, 104, 238, 0.4),
        0 0 2vw rgba(255, 255, 255, 0.2) inset;
    animation: 
        moveAndFade 1.5s ease-out forwards,
        subtleRotate 1.5s ease-in-out forwards;
    display: flex;
    align-items: center;
    justify-content: center;
}
.square-text {
    font-size: 7.5vw;
    color: #fff;
    font-weight: 700;
    text-shadow: 0 0 1vw rgba(255, 255, 255, 0.7), 0 0.3vw 0.5vw rgba(0, 0, 0, 0.2);
}
.square-tl { top: -30vw; left: -30vw; }
.square-br { bottom: -30vw; right: -30vw; }
@keyframes subtleRotate {
    0% { transform: rotate(0deg) translate(0, 0); }
    50% { transform: rotate(2deg) translate(-0.5vw, -0.5vw); }
    100% { transform: rotate(0deg) translate(0, 0); }
}
.square-br {
    animation: 
        moveAndFade 1.5s ease-out forwards,
        subtleRotateReverse 1.5s ease-in-out forwards;
}
@keyframes subtleRotateReverse {
    0% { transform: rotate(0deg) translate(0, 0); }
    50% { transform: rotate(-2deg) translate(0.5vw, 0.5vw); }
    100% { transform: rotate(0deg) translate(0, 0); }
}
/* 文字粒子：科技感升级+原有气泡风 */
.text-particle {
    position: absolute;
    width: 9vw; 
    height: 9vw;
    /* 科技感渐变：白→浅蓝，通透有层次 */
    background: linear-gradient(45deg, rgba(255, 255, 255, 0.9), rgba(180, 220, 255, 0.8));
    border-radius: 50%;
    /* 科技感光晕：蓝+青双阴影，强化发光 */
    box-shadow: 
        0 0 3vw rgba(60, 160, 255, 0.7),
        0 0 1.5vw rgba(100, 200, 255, 0.5),
        0 0 1vw rgba(255, 255, 255, 0.9) inset;
    /* 科技感细边框：淡蓝描边 */
    border: 0.2vw solid rgba(80, 180, 255, 0.8);
    opacity: 0;
    animation: 
        explodeFadeIn 1.2s ease-out forwards,
        stay 1.2s ease-out forwards,
        fadeOutParticle 0.8s ease-out forwards,
        techPulse 1s ease-in-out infinite alternate; /* 科技感脉冲闪烁 */
    display: flex;
    align-items: center;
    justify-content: center;
    top: 50%;
    left: 50%;
    margin-top: -4.5vw;
    margin-left: -4.5vw;
    z-index: 12;
    overflow: hidden;
}
.text-particle.p1 { --x: 0; --y: -22vw; animation-delay: 1.4s, 2.6s, 3.8s, 1.4s; }
.text-particle.p2 { --x: 18vw; --y: -18vw; animation-delay: 1.5s, 2.7s, 3.9s, 1.5s; }
.text-particle.p3 { --x: 22vw; --y: 0; animation-delay: 1.6s, 2.8s, 4.0s, 1.6s; }
.text-particle.p4 { --x: 18vw; --y: 18vw; animation-delay: 1.7s, 2.9s, 4.1s, 1.7s; }
.text-particle.p5 { --x: 0; --y: 22vw; animation-delay: 1.8s, 3.0s, 4.2s, 1.8s; }
.text-particle.p6 { --x: -18vw; --y: 18vw; animation-delay: 1.9s, 3.1s, 4.3s, 1.9s; }
.text-particle.p7 { --x: -22vw; --y: 0; animation-delay: 2.0s, 3.2s, 4.4s, 2.0s; }
.text-particle.p8 { --x: -18vw; --y: -18vw; animation-delay: 2.1s, 3.3s, 4.5s, 2.1s; }
.particle-text {
    font-size: 3.5vw;
    color: #7a28a8;
    font-weight: 700;
    z-index: 13;
    /* 文字科技感：轻微发光描边 */
    text-shadow: 0 0 0.5vw rgba(80, 180, 255, 0.6);
}
@keyframes moveAndFade { 
    0% { opacity: 1; } 
    100% { opacity: 0; top: 50%; left: 50%; margin-top: -15vw; margin-left: -15vw; }
}
@keyframes explodeFadeIn {
    0% { opacity: 0; transform: translate(0,0); }
    100% { opacity: 1; transform: translate(var(--x), var(--y)); }
}
@keyframes stay {
    0% { opacity: 1; transform: translate(var(--x), var(--y)); }
    100% { opacity: 1; transform: translate(var(--x), var(--y)); }
}
@keyframes fadeOutParticle {
    0% { opacity: 1; transform: translate(var(--x), var(--y)); }
    100% { opacity: 0; transform: translate(var(--x), var(--y)) scale(0.9); }
}
/* 文字粒子科技脉冲：轻微缩放+光晕变化 */
@keyframes techPulse {
    0% { 
        transform: translate(var(--x), var(--y)) scale(1);
        box-shadow: 
            0 0 3vw rgba(60, 160, 255, 0.7),
            0 0 1.5vw rgba(100, 200, 255, 0.5),
            0 0 1vw rgba(255, 255, 255, 0.9) inset;
    }
    100% { 
        transform: translate(var(--x), var(--y)) scale(1.05);
        box-shadow: 
            0 0 3.5vw rgba(60, 160, 255, 0.8),
            0 0 2vw rgba(100, 200, 255, 0.6),
            0 0 1vw rgba(255, 255, 255, 0.9) inset;
    }
}