body{
margin:0;
font-family:Arial;
background:#0d1117;
color:#fff;
transition:0.4s;
}

.hero{
height:100vh;
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
background:linear-gradient(135deg,#0f2027,#203a43,#2c5364);
}

.btn{
padding:12px 25px;
background:#00c6ff;
color:#fff;
text-decoration:none;
border-radius:30px;
}

.card{
width:90%;
max-width:400px;
margin:50px auto;
background:#161b22;
padding:30px;
border-radius:15px;
}

input{
width:100%;
padding:10px;
margin:10px 0;
}

button{
width:100%;
padding:10px;
background:#238636;
color:#fff;
border:none;
}

.dashboard .grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
gap:20px;
}

.box{
background:#21262d;
padding:20px;
border-radius:10px;
text-align:center;
}