:root { color-scheme: light; font-family: Inter, "PingFang SC", "Microsoft YaHei", sans-serif; color: #102b3b; background: #eaf4f7; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: linear-gradient(145deg, rgba(231,245,247,.92), rgba(210,231,239,.82)), url("/keadmin/admin-bg.jpg") center/cover fixed; }
.login-shell { min-height: 100vh; display: grid; place-items: center; padding: 32px 18px; }
.login-card { width: min(430px, 100%); padding: 30px; border: 1px solid rgba(255,255,255,.82); border-radius: 28px; background: rgba(255,255,255,.82); box-shadow: 0 28px 80px rgba(27,76,96,.2); backdrop-filter: blur(24px); }
.brand { display: flex; align-items: center; gap: 12px; padding-bottom: 24px; border-bottom: 1px solid rgba(73,110,124,.14); }
.brand img { width: 46px; height: 46px; border-radius: 13px; }
.brand div { display: grid; gap: 2px; }
.brand span { color: #167da1; font-size: 12px; font-weight: 800; letter-spacing: .08em; }
.brand strong { font-size: 18px; }
form { display: grid; gap: 16px; padding-top: 24px; }
.heading h1 { margin: 0 0 7px; font-size: 28px; letter-spacing: -.03em; }
.heading p, .security-note { margin: 0; color: #6c808b; font-size: 13px; line-height: 1.7; }
label { display: grid; gap: 8px; color: #3c5562; font-size: 13px; font-weight: 700; }
input { width: 100%; height: 48px; border: 1px solid rgba(71,104,118,.25); border-radius: 14px; background: rgba(255,255,255,.88); padding: 0 14px; color: #102b3b; font: inherit; outline: none; }
input:focus { border-color: #1285ad; box-shadow: 0 0 0 4px rgba(18,133,173,.12); }
button { height: 48px; border: 0; border-radius: 14px; color: white; background: linear-gradient(135deg, #1687b3, #07567e); font: inherit; font-weight: 800; cursor: pointer; box-shadow: 0 10px 25px rgba(13,105,142,.22); }
button:disabled { opacity: .6; cursor: wait; }
.form-error { margin: -3px 0 0; padding: 10px 12px; border-radius: 11px; color: #a42c2c; background: #fff0ef; font-size: 13px; line-height: 1.5; }
.security-note { padding-top: 20px; text-align: center; }
[hidden] { display: none !important; }
@media (max-width: 520px) { .login-card { padding: 24px; border-radius: 22px; } }