.auth-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.45); backdrop-filter:blur(4px); z-index:9999; justify-content:center; align-items:center; padding:16px; }
.auth-overlay.show { display:flex; animation:fadeIn .2s ease; }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
.auth-modal {
    background:white; border-radius:20px; padding:36px 32px 28px; width:100%; max-width:420px;
    box-shadow:0 20px 60px rgba(0,0,0,.2); position:relative;
    animation:slideUp .3s ease;
}
@keyframes slideUp { from{opacity:0;transform:translateY(30px)} to{opacity:1;transform:translateY(0)} }
.auth-close { position:absolute; top:14px; right:14px; background:var(--grey-100); border:none; width:32px; height:32px; border-radius:50%; cursor:pointer; color:var(--grey-500); font-size:.9rem; display:flex; align-items:center; justify-content:center; transition:all .15s; }
.auth-close:hover { background:var(--grey-200); color:var(--grey-800); }
.auth-icon { width:56px; height:56px; border-radius:16px; background:linear-gradient(135deg,#16a34a,#4ade80); display:flex; align-items:center; justify-content:center; margin:0 auto 16px; font-size:1.4rem; color:white; }
.auth-title { font-family:var(--font-display); font-size:1.5rem; font-weight:800; color:var(--grey-900); text-align:center; margin-bottom:4px; }
.auth-sub { text-align:center; color:var(--grey-500); font-size:.88rem; margin-bottom:20px; }
.auth-field { position:relative; margin-bottom:14px; }
.auth-field i { position:absolute; left:14px; top:50%; transform:translateY(-50%); color:var(--grey-400); font-size:.85rem; }
.auth-field input {
    width:100%; padding:12px 14px 12px 42px; border:1.5px solid var(--grey-200); border-radius:12px;
    font-size:.92rem; font-family:var(--font-body); color:var(--grey-800); background:var(--grey-50);
    transition:border-color .2s, box-shadow .2s;
}
.auth-field input:focus { outline:none; border-color:var(--green-primary); box-shadow:0 0 0 3px rgba(22,163,74,.1); background:white; }
.auth-btn {
    width:100%; padding:13px; background:var(--green-primary); color:white; border:none; border-radius:12px;
    font-size:.95rem; font-weight:700; font-family:var(--font-display); cursor:pointer;
    transition:background .2s, transform .1s; margin-top:4px;
}
.auth-btn:hover { background:var(--green-dark); }
.auth-btn:active { transform:scale(.98); }
.auth-btn:disabled { opacity:.6; cursor:not-allowed; }
.auth-switch { text-align:center; margin-top:18px; font-size:.88rem; color:var(--grey-500); }
.auth-switch a { color:var(--green-primary); font-weight:700; text-decoration:none; }
.auth-switch a:hover { text-decoration:underline; }
.auth-alert { padding:10px 14px; border-radius:10px; font-size:.85rem; margin-bottom:14px; display:flex; align-items:center; gap:8px; }
.auth-alert.error { background:#fef2f2; color:#dc2626; border:1px solid #fecaca; }
.auth-alert.success { background:#f0fdf4; color:#16a34a; border:1px solid #bbf7d0; }
.auth-benefits { display:flex; gap:10px; justify-content:center; margin-bottom:18px; flex-wrap:wrap; }
.auth-benefits span { font-size:.78rem; color:var(--green-dark); background:#f0fdf4; padding:4px 10px; border-radius:999px; font-weight:600; }
.auth-benefits i { color:var(--green-primary); margin-right:3px; font-size:.7rem; }
@media(max-width:480px) { .auth-modal { padding:28px 20px 22px; border-radius:16px; } }
