:root {
  color-scheme: light;
  font-family: "Microsoft YaHei", "Segoe UI", sans-serif;
  background: #eefaff;
  color: #073b5c;
}

* { box-sizing: border-box; }

body { margin: 0; min-height: 100vh; background: linear-gradient(135deg, #eafaff 0%, #ffffff 52%, #d9f5fb 100%); }

.login-shell { min-height: 100vh; display: grid; place-items: center; padding: 24px; }

.login-panel { width: min(100%, 420px); padding: 38px 40px 40px; border: 1px solid #b6e5f0; border-radius: 14px; background: #fff; box-shadow: 0 18px 50px rgba(0, 100, 135, .12); }

.brand-mark { width: fit-content; padding: 8px 14px; border-radius: 7px; background: #08b9d3; color: #fff; font-weight: 800; letter-spacing: 2px; }
.eyebrow { margin: 26px 0 7px; color: #0783a4; font-size: 14px; }
h1 { margin: 0; font-size: 28px; color: #073b5c; }
.hint { margin: 12px 0 26px; color: #607b8c; line-height: 1.7; font-size: 14px; }
label { display: block; margin-bottom: 8px; font-size: 14px; font-weight: 700; }
input { width: 100%; height: 46px; padding: 0 13px; border: 1px solid #aadce8; border-radius: 7px; outline: none; font-size: 16px; }
input:focus { border-color: #06aeca; box-shadow: 0 0 0 3px rgba(6, 174, 202, .14); }
button { width: 100%; height: 46px; margin-top: 18px; border: 0; border-radius: 7px; background: #0784a1; color: #fff; font-size: 16px; font-weight: 700; cursor: pointer; }
button:hover { background: #056d86; }
button:disabled { opacity: .65; cursor: wait; }
.error { margin: 13px 0 0; color: #c33c3c; font-size: 14px; }