html, body { height: 100%; margin: 0; }
* { font-family: 'Poppins', sans-serif; }

.input-focus {
    transition: all 0.2s ease;
}
.input-focus:focus {
    border-color: #3B82F6;
    box-shadow: 0 0 0 3px rgba(59,130,246,0.1);
    outline: none;
}

.btn-loading { transition: all 0.2s ease; }
.btn-loading:disabled { opacity: 0.7; cursor: not-allowed; }

.error-state { border-color: #EF4444 !important; }
.error-state:focus { box-shadow: 0 0 0 3px rgba(239,68,68,0.1) !important; }

.eye-toggle { cursor: pointer; transition: color 0.2s ease; }
.eye-toggle:hover { color: #3B82F6; }

@keyframes slideIn {
    from { opacity: 0; transform: translateY(-8px); }
    to   { opacity: 1; transform: translateY(0); }
}
.error-message { animation: slideIn 0.3s ease; }

@keyframes spin { to { transform: rotate(360deg); } }