/* IFORCOMエフェクト用スタイル */
.iforcom-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
    z-index: 100;
    opacity: 0;
}

.iforcom-text {
    font-size: 120px;
    font-weight: 900;
    font-family: 'Arial Black', 'Impact', sans-serif;
    letter-spacing: 10px;
    color: transparent;
    -webkit-text-stroke: 3px #00ffff;
    text-shadow: 
        0 0 10px #00ffff,
        0 0 20px #00ffff,
        0 0 40px #00ffff,
        0 0 80px #ff00ff,
        0 0 120px #ff00ff;
    animation: none;
}

@keyframes neonPulse {
    0%, 100% {
        text-shadow: 
            0 0 10px #00ffff,
            0 0 20px #00ffff,
            0 0 40px #00ffff,
            0 0 80px #ff00ff,
            0 0 120px #ff00ff;
        -webkit-text-stroke: 3px #00ffff;
    }
    25% {
        text-shadow: 
            0 0 5px #ff00ff,
            0 0 15px #ff00ff,
            0 0 30px #ff00ff,
            0 0 60px #00ffff,
            0 0 100px #00ffff;
        -webkit-text-stroke: 3px #ff00ff;
    }
    50% {
        text-shadow: 
            0 0 15px #ffff00,
            0 0 30px #ffff00,
            0 0 50px #ff00ff,
            0 0 100px #00ffff,
            0 0 150px #00ffff;
        -webkit-text-stroke: 3px #ffff00;
    }
    75% {
        text-shadow: 
            0 0 10px #00ff00,
            0 0 25px #00ff00,
            0 0 45px #00ffff,
            0 0 90px #ff00ff,
            0 0 130px #ff00ff;
        -webkit-text-stroke: 3px #00ff00;
    }
}

.iforcom-mask-active {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25'%3E%3Ctext x='50%25' y='55%25' text-anchor='middle' dominant-baseline='middle' font-size='150' font-weight='900' font-family='Arial Black, Impact, sans-serif' fill='white'%3EIFORCOM%3C/text%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25'%3E%3Ctext x='50%25' y='55%25' text-anchor='middle' dominant-baseline='middle' font-size='150' font-weight='900' font-family='Arial Black, Impact, sans-serif' fill='white'%3EIFORCOM%3C/text%3E%3C/svg%3E");
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

/* iFORCOM i点拡大エフェクト用 */
.iforcom-idot-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
    z-index: 100;
    opacity: 0;
    background: transparent;
}

.iforcom-idot-text {
    font-size: 100px;
    font-weight: 900;
    font-family: 'Arial Black', 'Impact', sans-serif;
    letter-spacing: 8px;
    color: #fff;
    text-shadow: 
        0 0 10px #00ffff,
        0 0 20px #00ffff,
        0 0 40px #ff00ff;
    position: relative;
}

.iforcom-idot-text .i-letter {
    position: relative;
    display: inline-block;
}

.iforcom-idot-text .i-dot {
    position: absolute;
    top: -8px;
    left: 50%;
    transform: translateX(-50%);
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #00ffff;
    box-shadow: 
        0 0 10px #00ffff,
        0 0 20px #00ffff,
        0 0 40px #ff00ff,
        0 0 60px #ff00ff;
}

.iforcom-idot-text .i-body {
    display: inline-block;
}

/* iの点から拡大する円形マスク */
.idot-circle-mask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99;
    pointer-events: none;
}

.idot-next-preview {
    position: absolute;
    border-radius: 50%;
    overflow: hidden;
    box-shadow: 
        0 0 20px #00ffff,
        0 0 40px #ff00ff,
        0 0 60px #00ffff;
    z-index: 101;
}

.idot-next-preview iframe {
    width: 100%;
    height: 100%;
    border: none;
    pointer-events: none;
}