:root { font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei","PingFang SC",sans-serif; color:#17201d; background:#eef3f1; }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; min-height:100vh; display:grid; place-items:center; background:#eef3f1; }
.login-shell { width:min(100%,430px); padding:18px; }
.login-panel { padding:30px 24px 24px; border:1px solid #dce5e1; border-radius:10px; background:#fff; box-shadow:0 18px 55px #16352b14; }
.login-mark { width:48px; height:48px; display:grid; place-items:center; border-radius:9px; color:#fff; background:#08765d; }
.login-mark svg { width:25px; }
.eyebrow { margin:19px 0 0; color:#08765d; font-size:11px; font-weight:750; }
h1 { margin:5px 0 0; font-size:25px; }
.intro { margin:8px 0 23px; color:#6d7974; font-size:12px; }
label { display:block; margin-top:15px; }
label>span { display:block; margin-bottom:7px; color:#46534e; font-size:12px; font-weight:700; }
.input-wrap { position:relative; }
.input-wrap>svg { position:absolute; left:12px; top:13px; width:18px; color:#83908b; }
input { width:100%; height:46px; padding:0 42px; border:1px solid #cdd7d3; border-radius:7px; outline:0; font-size:15px; }
input:focus { border-color:#08765d; box-shadow:0 0 0 3px #08765d16; }
.input-wrap button { position:absolute; right:5px; top:5px; width:36px; height:36px; border:0; border-radius:6px; display:grid; place-items:center; color:#7c8984; background:transparent; }
.input-wrap button svg { width:18px; }
.login-error { min-height:17px; margin:8px 0 0; color:#b43d3d; font-size:11px; }
.login-button { width:100%; height:46px; margin-top:5px; border:0; border-radius:7px; color:#fff; background:#08765d; font-size:15px; font-weight:750; }
.login-button:disabled { background:#a9c7bd; }
.login-note { margin:18px 0 0; color:#909b97; text-align:center; font-size:10px; }
@media(max-width:480px){ body{display:block}.login-shell{padding:42px 16px}.login-panel{padding:27px 20px 22px} }