html, body { height: 100%; min-height: 100vh; }
body { font-family: 'Inter', sans-serif; }
.input-icon { pointer-events: none; position: absolute; right: 14px; top: 50%; transform: translateY(-50%); font-size: 1.3rem; }
.form-error { color: #ef4444; font-size: 0.95rem; margin-top: 2px; }
.modal { display: flex; position: fixed; z-index: 50; left: 0; top: 0; width: 100vw; height: 100vh; background: rgba(0,0,0,0.5); justify-content: center; align-items: center; }
.modal-content { background: #fff; border-radius: 12px; padding: 2rem 2.5rem; max-width: 420px; width: 90%; text-align: center; position: relative; animation: fadeIn 0.3s; }
@media (prefers-color-scheme: dark) {
    body { background: #1e293b; color: #f3f4f6; }
    .modal-content { background: #1e293b; color: #fff; }
}
@keyframes fadeIn { from { opacity: 0; transform: translateY(-20px);} to { opacity: 1; transform: translateY(0);} }
.hidden { display: none !important; }
input[readonly] { cursor: not-allowed; }