[hidden] { display: none !important; }
.login-body { min-height: 100vh; display: flex; }
.login-wrap { margin: auto; width: 100%; max-width: 420px; padding: 24px 16px; text-align: center; }
.login-card { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 36px 32px 28px; box-shadow: 0 6px 24px rgba(0, 0, 0, .08); }
.login-brand { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-bottom: 12px; }
.login-brand img { display: block; }
.login-brand h1 { margin: 0; font-size: 28px; letter-spacing: -.02em; color: var(--text); }
.login-tag { color: var(--muted); margin: 0 0 26px; font-size: 15px; }
.ms-btn { display: flex; align-items: center; justify-content: center; gap: 12px; width: 100%; padding: 11px 16px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); color: var(--text); font-weight: 600; font-size: 15px; }
.ms-btn:hover { background: var(--bg); text-decoration: none; border-color: var(--accent); }
.ms-btn:focus-visible, .login-dev:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.ms-btn[aria-busy="true"] { opacity: .6; pointer-events: none; }
.login-msg { text-align: left; border-radius: 8px; padding: 10px 12px; margin-bottom: 16px; font-size: 14px; background: var(--small-bg); color: var(--small); }
.login-msg.err { background: var(--blocker-bg); color: var(--blocker); }
.login-dev { display: inline-block; margin-top: 12px; font-size: 13px; }
.login-note { margin: 20px 0 0; font-size: 12px; color: var(--muted); }
.login-foot { margin-top: 16px; font-size: 12px; color: var(--muted); }