*{
margin:0;
padding:0;
box-sizing:border-box;
font-family: "Segoe UI", sans-serif;
}

body{
background: radial-gradient(circle at top, #0a1a33, #020617);
color:white;
min-height:100vh;
}

header{
background: linear-gradient(90deg,#020617,#0a1a33,#020617);
padding:15px;
text-align:center;
font-size:22px;
font-weight:700;
letter-spacing:1px;
box-shadow:0 0 20px #00e5ff;
}

#market{
display:grid;
grid-template-columns: repeat(auto-fit, minmax(140px,1fr));
gap:15px;
padding:20px;
}

.card{
background: linear-gradient(145deg,#020617,#0a1a33);
border-radius:15px;
padding:15px;
text-align:center;
box-shadow:0 0 20px rgba(0,255,255,0.3);
transition:0.3s;
position:relative;
overflow:hidden;
}

.card:hover{
transform: scale(1.05);
box-shadow:0 0 35px #00e5ff;
}

.card::after{
content:"";
position:absolute;
top:0;
left:-100%;
width:100%;
height:100%;
background: linear-gradient(120deg,transparent,rgba(0,255,255,0.5),transparent);
animation:shine 3s infinite;
}

@keyframes shine{
0%{left:-100%;}
50%{left:100%;}
100%{left:100%;}
}

.name{
font-size:14px;
color:#7dd3fc;
margin-bottom:8px;
letter-spacing:1px;
}

.value{
font-size:22px;
font-weight:bold;
color:#00e5ff;
text-shadow:0 0 10px #00e5ff;
}

footer{
text-align:center;
padding:10px;
font-size:12px;
color:#7dd3fc;
opacity:0.7;
}