* { box-sizing: border-box; } body { margin: 0; color: #182238; background: #eef3f8; font-family: "Microsoft YaHei", sans-serif; }
.auth-shell { display: grid; width: min(920px, calc(100% - 30px)); min-height: 560px; grid-template-columns: 1fr 1fr; margin: 7vh auto; overflow: hidden; border-radius: 20px; background: white; box-shadow: 0 25px 70px rgba(34,48,72,.16); }
.auth-intro { display: flex; flex-direction: column; justify-content: center; padding: 55px; color: white; background: linear-gradient(145deg,#102544,#1d4ed8); }
.auth-logo { display: grid; width: 52px; height: 52px; place-items: center; border-radius: 13px; background: #3b82f6; font-weight: 800; }
.auth-intro h1 { margin: 24px 0 10px; font-size: 32px; }.auth-intro p { color: #c8d8dd; line-height: 1.8; }
.auth-card { align-self: center; padding: 48px; }.auth-card h2 { margin: 0 0 8px; }.auth-card > p { margin: 0 0 25px; color: #7d899b; }
.auth-card form { display: grid; gap: 15px; }.auth-card label { color: #4e5a6c; font-size: 13px; font-weight: 700; }
.auth-card input, .auth-card select { width: 100%; margin-top: 7px; border: 1px solid #d3dce7; border-radius: 9px; padding: 11px; font: inherit; }
.auth-card button, .auth-button { display: block; border: 0; border-radius: 9px; padding: 12px; color: white; background: #2563eb; font: inherit; text-align: center; text-decoration: none; cursor: pointer; }
.auth-footer { margin-top: 20px; color: #7d899b; font-size: 13px; text-align: center; }.auth-footer a { color: #2563eb; }
.auth-error { margin-bottom: 16px; border-radius: 8px; padding: 10px; color: #9b372f; background: #fdecea; font-size: 13px; }
.auth-card em { display: block; margin-top: 5px; color: #b33b32; font-size: 12px; font-style: normal; }.register-success { text-align: center; }.register-success .auth-button { margin-top: 22px; }
@media (max-width: 720px) { .auth-shell { grid-template-columns: 1fr; margin: 15px auto; }.auth-intro { padding: 30px; }.auth-card { padding: 30px; } }