.login-body { display:flex; align-items:center; justify-content:center; min-height:100vh; background:var(--bg); }
.login-card { background:var(--surface); border:1px solid var(--border); border-radius:20px; padding:2.5rem 2rem; width:100%; max-width:380px; box-shadow:0 8px 40px rgba(0,0,0,0.08); }
.login-logo { display:flex; align-items:center; justify-content:center; gap:0.5rem; margin-bottom:0.25rem; }
.login-logo .logo-icon { font-size:1.6rem; }
.login-logo .logo-text { font-family:var(--font-head); font-size:1.6rem; font-weight:800; letter-spacing:-0.03em; }
.login-sub { text-align:center; font-size:0.78rem; color:var(--text-3); font-weight:500; text-transform:uppercase; letter-spacing:0.08em; margin-bottom:1.75rem; }
.login-error { background:#FEF2F2; color:#991B1B; border:1px solid #FECACA; border-radius:8px; padding:0.6rem 0.9rem; font-size:0.84rem; margin-bottom:1.25rem; }
html[data-theme="dark"] .login-error { background:#2D1515; color:#FCA5A5; border-color:#7F1D1D; }
.form-group { margin-bottom:1rem; }
.form-group label { display:block; font-size:0.8rem; font-weight:600; color:var(--text-2); margin-bottom:0.35rem; }
.form-group input[type="text"], .form-group input[type="password"] { width:100%; padding:0.6rem 0.85rem; border:1px solid var(--border); border-radius:8px; background:var(--bg); color:var(--text); font-size:0.9rem; font-family:var(--font-body); transition:border-color 0.15s; outline:none; }
.form-group input:focus { border-color:var(--text-2); }
.login-btn { width:100%; padding:0.7rem; background:var(--text); color:var(--surface); border:none; border-radius:10px; font-size:0.92rem; font-weight:600; font-family:var(--font-body); cursor:pointer; margin-top:0.5rem; transition:opacity 0.15s; }
.login-btn:hover { opacity:0.85; }
.login-theme-btn { position:fixed; bottom:1.25rem; right:1.25rem; }