:root { color-scheme: light; font-family: "Microsoft YaHei", "PingFang SC", sans-serif; background: #edf2f6; color: #1b2530; }
* { box-sizing: border-box; }
body { min-height: 100vh; margin: 0; display: grid; place-items: center; background: linear-gradient(135deg, #e9f1f8 0%, #f8fafc 54%, #eef4f2 100%); }
body::before { position: fixed; inset: 0; background: radial-gradient(circle at 18% 20%, rgba(47, 102, 223, .12), transparent 34%), radial-gradient(circle at 82% 78%, rgba(26, 141, 101, .1), transparent 30%); content: ""; pointer-events: none; }
.login-shell { position: relative; display: grid; width: min(920px, calc(100vw - 40px)); min-height: 530px; grid-template-columns: .9fr 1.1fr; overflow: hidden; border: 1px solid rgba(34, 54, 75, .1); border-radius: 8px; background: #fff; box-shadow: 0 28px 70px rgba(28, 47, 67, .16); }
.login-brand { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 22px; padding: 54px; background: #202a35; color: #fff; text-align: center; }
.login-brand img { width: 92px; height: 92px; object-fit: contain; }
.login-brand div { display: grid; gap: 8px; }
.login-brand strong { font-size: 30px; font-weight: 700; }
.login-brand span { color: #aebccc; font-size: 15px; }
.login-panel { display: flex; justify-content: center; flex-direction: column; padding: 62px 72px; }
.login-panel header { margin-bottom: 32px; }
.login-panel header > span { color: #2f66df; font-size: 13px; font-weight: 700; }
.login-panel h1 { margin: 10px 0 8px; font-size: 28px; letter-spacing: 0; }
.login-panel header p { margin: 0; color: #7a8794; font-size: 14px; }
.login-panel form { display: grid; gap: 20px; }
.login-panel label { display: grid; gap: 8px; color: #43505d; font-size: 13px; font-weight: 600; }
.login-panel input { width: 100%; height: 46px; padding: 0 14px; border: 1px solid #d5dde5; border-radius: 6px; outline: 0; background: #fbfcfd; color: #1c2834; font: inherit; font-weight: 400; }
.login-panel input:focus { border-color: #3972e3; background: #fff; box-shadow: 0 0 0 3px rgba(57, 114, 227, .1); }
.login-panel button { height: 46px; border: 0; border-radius: 6px; background: #2f66df; color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.login-panel button:disabled { cursor: wait; opacity: .7; }
.login-error { min-height: 18px; margin: -8px 0 -6px; color: #d33f49; font-size: 13px; }
.login-panel footer { margin-top: 28px; color: #96a1ac; font-size: 12px; }
.register-link { display: block; margin-top: 18px; color: #2f66df; font-size: 13px; text-align: center; text-decoration: none; }
.register-shell { width: min(980px, calc(100vw - 40px)); min-height: 620px; }
.register-shell .login-panel { padding-top: 42px; padding-bottom: 42px; }
.register-shell .login-panel header { margin-bottom: 24px; }
.register-shell .login-panel form { gap: 14px; }
.register-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.code-field { display: grid; grid-template-columns: minmax(0, 1fr) 112px; gap: 10px; }
.code-field button { height: 46px; padding: 0 10px; background: #e9effa; color: #2f66df; font-size: 13px; }
.development-code { padding: 9px 12px; border: 1px solid #cfe0fb; border-radius: 5px; background: #f1f6ff; color: #2f66df; font-size: 13px; }
.agent-invitation { margin: -10px 0 20px; padding: 10px 12px; border-left: 3px solid #168f67; background: #edf8f4; color: #167655; font-size: 13px; font-weight: 700; }
.agreement { display: flex !important; align-items: center; grid-template-columns: none !important; gap: 8px !important; font-weight: 400 !important; }
.agreement input { width: 15px; height: 15px; }
.platform-login .login-brand { background: #272d31; }
.platform-login .login-panel header > span { color: #168f67; }
.platform-login .login-panel button { background: #168f67; }
.platform-login .login-panel input:focus { border-color: #168f67; box-shadow: 0 0 0 3px rgba(22, 143, 103, .1); }
@media (max-width: 720px) { .login-shell { width: min(440px, calc(100vw - 28px)); min-height: auto; grid-template-columns: 1fr; } .login-brand { flex-direction: row; padding: 26px; } .login-brand img { width: 52px; height: 52px; } .login-brand strong { font-size: 22px; } .login-panel { padding: 38px 30px; } .register-grid { grid-template-columns: 1fr; } }