/* ====== Auth Pages ====== */
.auth-wrapper {
    display: flex; align-items: center; justify-content: center;
    min-height: 100vh; padding: 20px;
    background: #09090b;
    position: relative; overflow: hidden;
}
.auth-wrapper::before {
    content: '';
    position: absolute; top: -50%; left: -50%; width: 200%; height: 200%;
    background: radial-gradient(ellipse at 50% 50%, rgba(59,130,246,0.06) 0%, transparent 60%);
    animation: authGlow 8s ease-in-out infinite alternate;
}
@keyframes authGlow {
    0% { transform: translate(0, 0) scale(1); }
    100% { transform: translate(5%, -5%) scale(1.1); }
}

.auth-card {
    background: rgba(24,24,27,0.8);
    backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
    border: 1px solid #27272a; border-radius: 16px; padding: 40px;
    width: 100%; max-width: 420px; position: relative; z-index: 1;
    box-shadow: 0 0 0 1px rgba(59,130,246,0.05), 0 25px 50px rgba(0,0,0,0.5);
    animation: cardFadeIn 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}
@keyframes cardFadeIn {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

.auth-logo {
    text-align: center; margin-bottom: 24px;
}
.auth-card h2 { text-align: center; margin-bottom: 6px; font-size: 22px; color: #fafafa; font-weight: 600; }
.auth-card .subtitle { text-align: center; color: #71717a; font-size: 14px; margin-bottom: 28px; }
.auth-card .form-group { margin-bottom: 18px; }
.auth-card label { display: block; font-size: 13px; color: #a1a1aa; margin-bottom: 6px; font-weight: 500; }
.auth-card input[type="text"],
.auth-card input[type="email"],
.auth-card input[type="password"] {
    width: 100%; padding: 11px 14px;
    background: #09090b; border: 1px solid #27272a; border-radius: 10px; color: #fafafa;
    font-family: 'Inter', sans-serif; font-size: 14px; outline: none;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
.auth-card input:focus { border-color: #3b82f6; box-shadow: 0 0 0 3px rgba(59,130,246,0.15); }
.auth-card input::placeholder { color: #52525b; }
.auth-card .btn-primary {
    width: 100%; padding: 12px; border: none; border-radius: 10px;
    font-family: 'Inter', sans-serif; font-size: 15px; font-weight: 600; cursor: pointer; margin-top: 8px;
    background: linear-gradient(135deg, #3b82f6, #7c3aed); color: #fff;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); position: relative; overflow: hidden;
}
.auth-card .btn-primary:hover { box-shadow: 0 0 20px rgba(59,130,246,0.3); transform: translateY(-1px); }
.auth-card .btn-primary:active { transform: translateY(0); }
.auth-card .btn-primary:disabled { opacity: 0.5; cursor: not-allowed; transform: none; box-shadow: none; }
.auth-card .switch-link { text-align: center; margin-top: 24px; font-size: 14px; color: #71717a; }
.auth-card .switch-link a { color: #3b82f6; text-decoration: none; cursor: pointer; font-weight: 500; transition: color 0.15s; }
.auth-card .switch-link a:hover { color: #60a5fa; }
.auth-card .error-msg {
    background: rgba(239,68,68,0.08); border: 1px solid rgba(239,68,68,0.2); color: #ef4444;
    padding: 10px 14px; border-radius: 10px; font-size: 13px; margin-bottom: 16px; display: none;
}
.auth-card .error-msg.show { display: block; animation: shakeX 0.4s ease; }
@keyframes shakeX {
    0%,100% { transform: translateX(0); }
    20%,60% { transform: translateX(-6px); }
    40%,80% { transform: translateX(6px); }
}