/* ===== GLOBAL ===== */
body {
margin: 0;
font-family: 'Segoe UI', sans-serif;
background: radial-gradient(circle at top left, #1a0033, #000000);
color: #fff;
}

/* ===== CENTER WRAP ===== */
.auth-wrap {
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
}

/* ===== CARD ===== */
.auth-card {
width: 380px;
padding: 30px;
border-radius: 20px;
backdrop-filter: blur(20px);
background: rgba(255,255,255,0.05);
border: 1px solid rgba(255,255,255,0.1);
box-shadow: 0 0 40px rgba(0,0,0,0.6);
}

/* ===== TITLE ===== */
.auth-title {
font-size: 26px;
font-weight: 800;
margin-bottom: 10px;
}

.auth-sub {
font-size: 14px;
color: #aaa;
margin-bottom: 20px;
}

/* ===== INPUTS ===== */
.auth-input {
width: 100%;
padding: 14px;
margin-bottom: 14px;
border-radius: 12px;
border: none;
background: #111;
color: #fff;
}

/* ===== BUTTON ===== */
.auth-btn {
width: 100%;
padding: 14px;
border-radius: 30px;
border: none;
font-weight: bold;
cursor: pointer;
background: linear-gradient(90deg, #ff4dff, #00ccff);
color: #fff;
transition: 0.3s;
}

.auth-btn:hover {
opacity: 0.9;
}

/* ===== ALT LINK ===== */
.auth-link {
margin-top: 15px;
text-align: center;
font-size: 13px;
}

.auth-link a {
color: #00ccff;
text-decoration: none;
}

/* ===== LOGO ===== */
.auth-logo {
font-size: 22px;
font-weight: bold;
margin-bottom: 15px;
background: linear-gradient(90deg, #ff4dff, #00ccff);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}