* { margin:0; padding:0; box-sizing:border-box; }

body {
  font-family: 'Vazirmatn', Tahoma, sans-serif;
  min-height: 100vh;
  background: linear-gradient(135deg, #8b5cf6 0%, #6d28d9 50%, #4c1d95 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  direction: rtl;
}

.login-wrap { width: 100%; padding: 20px; display: flex; justify-content: center; }
.login-card { background: rgba(255,255,255,0.97); backdrop-filter: blur(20px); border-radius: 28px; padding: 48px 40px; max-width: 420px; width: 100%; box-shadow: 0 30px 80px rgba(0,0,0,0.3); text-align: center; animation: slideUp 0.5s ease; }
@keyframes slideUp { from { opacity:0; transform: translateY(30px); } to { opacity:1; transform: translateY(0); } }
.login-logo { font-size: 3rem; margin-bottom: 12px; }
.login-card h1 { color: #6d28d9; font-size: 1.6rem; font-weight: 900; margin-bottom: 6px; }
.login-sub { color: #64748b; font-size: 0.9rem; margin-bottom: 28px; }
.field { text-align: right; margin-bottom: 20px; }
.field label { display: block; font-size: 0.85rem; color: #4c1d95; margin-bottom: 6px; font-weight: 600; }
.field input { width: 100%; padding: 14px 18px; border: 2px solid #e2e8f0; border-radius: 12px; font-family: inherit; font-size: 1rem; transition: border 0.3s; background: #f8fafc; }
.field input:focus { outline: none; border-color: #8b5cf6; background: #fff; }
.login-btn { width: 100%; padding: 16px; background: linear-gradient(135deg, #8b5cf6, #6d28d9); color: #fff; border: none; border-radius: 14px; font-family: inherit; font-size: 1.05rem; font-weight: 700; cursor: pointer; transition: transform 0.2s, box-shadow 0.2s; box-shadow: 0 10px 24px rgba(109, 40, 217, 0.3); }
.login-btn:hover { transform: translateY(-2px); box-shadow: 0 14px 32px rgba(109, 40, 217, 0.4); }
.login-error { background: #fdf2f8; color: #be185d; padding: 12px; border-radius: 10px; font-size: 0.9rem; margin-bottom: 16px; }