
*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{
height:100vh;
display:flex;
align-items:center;
justify-content:center;
background:#0a0a0a;
color:#fff;
font-family:Inter, system-ui, sans-serif;
overflow:hidden;
}

.container{
text-align:center;
padding:40px 20px;
animation:fadeIn 1.2s ease;
}

.nickname{
font-size:clamp(72px,10vw,140px);
font-weight:800;
letter-spacing:6px;

background:linear-gradient(90deg,#ffffff,#dcdcdc,#ffffff);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;

text-shadow:
0 0 15px rgba(255,255,255,.35),
0 0 45px rgba(255,255,255,.15);
}

.divider{
width:120px;
height:1px;
background:rgba(255,255,255,0.2);
margin:35px auto 50px auto;
}

.links{
display:flex;
gap:28px;
flex-wrap:wrap;
justify-content:center;
}

.card{
display:flex;
flex-direction:column;
align-items:center;
gap:10px;
padding:18px 22px;

background:rgba(255,255,255,0.04);
border:1px solid rgba(255,255,255,0.08);
border-radius:14px;

backdrop-filter:blur(8px);

text-decoration:none;
color:#cfcfcf;

transition:0.25s;
min-width:110px;
}

.card img{
width:32px;
height:32px;
}

.card:hover{
transform:translateY(-5px) scale(1.06);
color:#fff;
border-color:rgba(255,255,255,0.25);
}

.card strong{
font-weight:600;
color:#fff;
font-size:14px;
}

@keyframes fadeIn{
from{
opacity:0;
transform:translateY(10px);
}
to{
opacity:1;
transform:translateY(0);
}
}
