:root { --blue: #0873ad; --blue-dark: #075985; --line: #c8d2d9; --text: #30383d; }
* { box-sizing: border-box; }
html, body { width: 100%; min-width: 760px; height: 100%; margin: 0; }
body { display: flex; flex-direction: column; color: var(--text); background: #edf2f5; font: 14px/1.5 "Microsoft YaHei", "PingFang SC", sans-serif; }
.login-topbar { display: flex; height: 58px; align-items: center; padding: 0 28px; color: #fff; background: linear-gradient(#1684bc, #086797); box-shadow: 0 1px 4px rgba(0, 44, 70, .25); }
.login-topbar strong { font-size: 21px; letter-spacing: 1px; }
.login-main { display: flex; flex: 1; align-items: center; justify-content: center; padding: 50px 20px 90px; background: radial-gradient(circle at 50% 35%, #fff 0, #eef4f7 46%, #dfe8ed 100%); }
.login-panel { width: 430px; border: 1px solid #b9c8d1; border-radius: 3px; background: #fff; box-shadow: 0 8px 26px rgba(26, 65, 86, .18); }
.panel-heading { display: flex; align-items: center; gap: 14px; padding: 23px 30px 20px; border-bottom: 1px solid #dce3e7; background: #f8fafb; }
.medical-mark { display: grid; width: 44px; height: 44px; place-items: center; border-radius: 50%; color: #fff; background: var(--blue); font: 700 30px/1 Arial; }
.panel-heading h1 { margin: 0 0 3px; color: #263238; font-size: 20px; }
.panel-heading p { margin: 0; color: #7b8991; font-size: 13px; }
form { padding: 25px 30px 30px; }
label { display: grid; grid-template-columns: 58px 1fr; align-items: center; margin-bottom: 17px; }
label span { color: #4d5a61; }
input { width: 100%; height: 38px; padding: 0 11px; border: 1px solid var(--line); border-radius: 2px; outline: 0; color: #27343b; background: #fff; font: inherit; }
input:focus { border-color: #1689c1; box-shadow: 0 0 0 2px rgba(22,137,193,.12); }
.login-error { margin: -4px 0 13px 58px; color: #c43d3d; font-size: 13px; }
button { width: calc(100% - 58px); height: 40px; margin-left: 58px; border: 1px solid #056395; border-radius: 2px; color: #fff; background: linear-gradient(#168dcc, #0872ab); font: 600 15px "Microsoft YaHei", sans-serif; cursor: pointer; }
button:hover { background: linear-gradient(#1599dc, #0878b5); }
button:disabled { cursor: default; opacity: .65; }