#authWrapper { display: flex; justify-content: center; align-items: center; min-height: 70vh; padding: 20px; }
.authCard { background: var(--card); padding: 40px; border-radius: 24px; border: 2px solid var(--border); width: 100%; max-width: 420px; box-shadow: 10px 10px 0px rgba(255,255,255,0.05); transition: 0.3s; }
.card-header { margin-bottom: 30px; }
.card-header h2 { font-size: 1.8rem; letter-spacing: -1px; margin-bottom: 8px; }
.card-header p { color: var(--sub); font-size: 0.9rem; }
.authCard input { width: 100%; padding: 16px; margin-bottom: 20px; border-radius: 14px; border: 2px solid var(--border); background: var(--bg); color: var(--text); font-size: 1rem; }
.authCard button { width: 100%; padding: 18px; border-radius: 14px; border: none; background: var(--text); color: var(--bg); font-weight: 800; cursor: pointer; }
.authCard button:disabled { opacity: 0.5; cursor: not-allowed; }
.pass-info { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; font-size: 0.7rem; color: var(--sub); margin-bottom: 20px; }
.switch-link { text-align: center; font-size: 0.85rem; margin-top: 25px; color: var(--sub); }
.switch-link a { color: var(--text); font-weight: 800; border-bottom: 1px solid var(--text); }
.toast-msg { position: fixed; top: 20px; left: 50%; transform: translateX(-50%); padding: 15px 25px; background: var(--text); color: var(--bg); border-radius: 12px; font-weight: 800; z-index: 9999; animation: slideDown 0.4s ease; }
.toast-msg.hide { opacity: 0; transition: 0.5s; }
@keyframes slideDown { from { top: -50px; opacity: 0; } to { top: 20px; opacity: 1; } }