.login-header-note { color: var(--text-secondary); font-size: 14px; }
.login-main { flex: 1; display: grid; place-items: center; padding: 56px 24px; }
.site-login-card { width: 100%; max-width: 430px; padding: 40px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); box-shadow: 0 12px 40px rgb(37 42 59 / 4%); animation: login-arrive 240ms ease-out; }
.login-emblem { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--accent-soft); color: var(--accent); font-size: 28px; margin-bottom: 24px; }
.login-eyebrow { color: var(--text-secondary); font-size: 13px; margin-bottom: 8px; }
.site-login-card h1 { font-size: 32px; margin-bottom: 12px; }
.site-login-card h1 span { color: var(--accent); }
.login-description { color: var(--text-secondary); margin-bottom: 28px; font-size: 15px; }
#login-form label { display: block; font-size: 14px; font-weight: 600; margin-bottom: 8px; }
#login-form input { display: block; width: 100%; min-height: 48px; border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 10px 14px; margin-bottom: 20px; color: var(--text); background: var(--surface); outline-offset: 2px; transition: border-color var(--transition); }
#login-form input::placeholder { color: var(--text-secondary); }
#login-form input:hover { border-color: var(--accent-border); }
.login-submit { width: 100%; min-height: 48px; border: 0; border-radius: var(--radius-sm); background: var(--accent); color: white; font-weight: 600; transition: background var(--transition), transform var(--transition); }
.login-submit:hover { background: #6250ba; }
.login-submit:active { transform: scale(.99); }
.login-submit:disabled { opacity: .65; cursor: wait; }
.login-restart { display: block; margin: 16px auto 0; padding: 6px; border: 0; background: transparent; color: var(--accent); }
.login-error { background: #fff2f2; color: #a93636; padding: 12px; border-radius: var(--radius-sm); margin-bottom: 20px; font-size: 14px; }
.site-footer { margin-top: 0; }
@keyframes login-arrive { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (max-width: 600px) { .login-main { padding: 32px 20px; } .site-login-card { padding: 28px 24px; } }
@media (prefers-reduced-motion: reduce) { .site-login-card { animation: none; } }