*{margin:0;padding:0;box-sizing:border-box;font-family:'Poppins',sans-serif}
body{background:#02030a;color:#fff;overflow:hidden}

/* RGB BORDER */
body::after{
 content:"";position:fixed;inset:0;padding:2px;
 background:linear-gradient(90deg,red,orange,yellow,green,cyan,blue,purple,red);
 background-size:400%;
 -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
 -webkit-mask-composite:xor;mask-composite:exclude;
 animation:border 6s linear infinite;pointer-events:none
}
@keyframes border{0%{background-position:0}100%{background-position:400%}}

canvas{position:fixed;top:0;left:0;z-index:-2}

/* ENTRY */
#loader{
 position:fixed;inset:0;
 display:flex;justify-content:center;align-items:center;
 z-index:9999;
 background:
 linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.9)),
 url("https://images.unsplash.com/photo-1518770660439-4636190af475");
 background-size:cover;
 background-position:center;
}

.entry-box{
 padding:35px;border-radius:20px;
 background:rgba(0,0,0,0.6);
 backdrop-filter:blur(15px);
 box-shadow:0 0 50px cyan;
 text-align:center;
 animation:glow 2s infinite alternate;
}

@keyframes glow{
 from{box-shadow:0 0 20px cyan}
 to{box-shadow:0 0 60px blue}
}

.entry-box h2{
 color:cyan;margin-bottom:15px;
 text-shadow:0 0 10px cyan;
}

#username{
 padding:12px;width:220px;border:none;
 border-radius:10px;text-align:center;
 background:#000;color:#0ff;
 box-shadow:0 0 15px cyan inset,0 0 10px cyan;
}

#enterBtn{
 margin-top:15px;padding:10px 30px;
 border:none;border-radius:12px;
 background:linear-gradient(45deg,cyan,blue);
 color:#000;font-weight:bold;
 cursor:pointer;box-shadow:0 0 20px cyan;
 transition:.3s;
}
#enterBtn:hover{
 transform:scale(1.1);
 box-shadow:0 0 40px cyan;
}

/* popup */
#popup{
 position:fixed;
 top:15px;left:50%;
 transform:translateX(-50%);
 background:#000;
 padding:10px 20px;
 border-radius:10px;
 box-shadow:0 0 20px cyan;
 display:none;
 z-index:999;
}

/* menu */
.menu{
 position:fixed;top:15px;left:50%;transform:translateX(-50%);
 display:flex;gap:15px;
 background:rgba(255,255,255,0.05);
 padding:10px 20px;border-radius:20px;
 backdrop-filter:blur(10px);
 box-shadow:0 0 20px cyan
}
.menu a{color:#0ff;text-decoration:none}

/* content */
.container{text-align:center;padding-top:120px}

.profile img{
 width:120px;height:120px;border-radius:50%;
 border:3px solid cyan;
 box-shadow:0 0 40px cyan;
}

h1{
 font-size:3rem;
 background:linear-gradient(90deg,cyan,blue);
 -webkit-background-clip:text;
 -webkit-text-fill-color:transparent
}

.links a{
 display:block;margin:10px auto;width:230px;
 padding:12px;border-radius:15px;
 color:#0ff;text-decoration:none;
 border:1px solid cyan;
}

/* footer */
.footer{
 position:fixed;bottom:10px;width:100%;
 text-align:center;color:#888;font-size:12px;
}

/* trail */
.trail{
 position:fixed;width:10px;height:10px;
 border-radius:50%;background:cyan;
 pointer-events:none;box-shadow:0 0 20px cyan
}