body{
    background: radial-gradient(circle at top center, #0b0018 0%, #060008 42%, #000000 100%);
    color:#7cfffa;
    font-family:'Courier New', monospace;
    overflow-x:hidden;
    text-align:center;
    padding:40px;
}

.overlay{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background-image:repeating-linear-gradient(
        rgba(255,255,255,0.02) 0px,
        rgba(255,255,255,0.02) 1px,
        transparent 2px,
        transparent 4px
    );
    pointer-events:none;
}

.signal{
    position:fixed;
    inset:0;
    background: radial-gradient(circle at center, rgba(255,255,255,0.04), transparent 25%);
    opacity:0.65;
    mix-blend-mode:screen;
    pointer-events:none;
}

.echo{
    margin: 30px auto 0;
    width: 80%;
    color: #ff8afc;
    letter-spacing: 0.25em;
    font-size: 1.1rem;
    opacity: 0.9;
    text-shadow: 0 0 20px rgba(255,138,252,0.35);
}

.echo span{
    display:block;
    animation:ghost 8s infinite;
}

@keyframes ghost{
    0%,100%{opacity:0.65; transform:translateX(0);} 
    50%{opacity:1; transform:translateX(6px) skewX(-6deg);}
}

.glitch{
    font-size:4.4rem;
    animation:glitch 1s infinite;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: #e8ff73;
    text-shadow: 0 0 15px #9dff4f, -2px 0 12px #ff68d7;
}

@keyframes glitch{
    0%{transform:translate(0px,0px);}
    20%{transform:translate(-2px,2px);}
    40%{transform:translate(2px,-2px);}
    60%{transform:translate(-1px,1px);}
    80%{transform:translate(1px,-1px);}
    100%{transform:translate(0px,0px);}
}

.warning{
    color:red;
    letter-spacing:4px;
}

.terminal{
    width:72%;
    margin:auto;
    border:1px solid #00ff88;
    padding:20px;
    margin-top:30px;
    background:rgba(18,255,160,0.07);
    box-shadow: 0 0 40px rgba(0,255,136,0.12);
    border-radius: 14px;
    backdrop-filter: blur(6px);
}

.links{
    margin-top:40px;
    display:flex;
    flex-direction:column;
    gap:20px;
}

a{
    color:#ae97ff;
    text-decoration:none;
    font-size:1.2rem;
    position: relative;
    mix-blend-mode:screen;
}

a:hover{
    color:white;
    text-shadow:0 0 16px #ff6bda, 0 0 24px #8afcff;
}

a::before{
    content: attr(data-glitch);
    position: absolute;
    left: 0;
    top: 0;
    color: rgba(255,255,255,0.15);
    z-index: -1;
    pointer-events: none;
}

.centerimg{
    margin-top:50px;
    width:300px;
    opacity:0.8;
    filter:contrast(180%) blur(0.7px) saturate(1.3);
    transform: rotateZ(-1deg);
}

.centerimg{ 
    transition: transform 180ms ease, filter 220ms ease, opacity 220ms ease;
    filter: url(#turbulence) contrast(150%) saturate(1.2);
}

.glitch-jolt{
    transform: translateX(-6px) rotate(-1deg) scale(1.02);
    filter: url(#turbulence) contrast(220%) saturate(1.6) hue-rotate(10deg);
}

@keyframes jitter{
    0%{transform:translateX(0)}
    20%{transform:translateX(-2px)}
    40%{transform:translateX(2px)}
    60%{transform:translateX(-1px)}
    80%{transform:translateX(1px)}
    100%{transform:translateX(0)}
}