:root{--green-950:#052f24;--green-800:#07573f;--green-650:#147354;--gold:#d3a84f;--ink:#18241f;--muted:#67736d;--line:#dbe5df;--white:#fff}
*{box-sizing:border-box}
html{min-height:100%;background:#e8efeb}
body{min-height:100vh;margin:0;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif;letter-spacing:0}
button,input{font:inherit}
.login-shell{width:100%;max-width:500px;min-height:100vh;margin:0 auto;background:var(--white);box-shadow:0 0 48px rgba(5,47,36,.14)}
.login-hero{position:relative;min-height:286px;padding:38px 26px;color:#fff;background-image:linear-gradient(180deg,rgba(3,42,30,.55),rgba(3,51,37,.91)),url("hero.jpg");background-size:cover;background-position:center 62%;overflow:hidden}
.brand{display:flex;align-items:center;gap:15px}
.brand img{width:66px;height:66px;display:block;object-fit:cover;border-radius:50%;box-shadow:0 7px 24px rgba(0,24,17,.28)}
.brand h1{margin:0 0 5px;font-size:31px;line-height:1.05;font-weight:760}
.brand p{margin:0;color:#d8e8e0;font-size:17px}
.security-chip{position:absolute;left:26px;bottom:32px;display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid rgba(255,255,255,.35);border-radius:18px;background:rgba(4,50,36,.44);font-size:13px;color:#e5f2ec;backdrop-filter:blur(4px)}
.security-chip i{width:8px;height:8px;border-radius:50%;background:#69d5a2;box-shadow:0 0 0 4px rgba(105,213,162,.15)}
.login-panel{padding:34px 26px 38px}
.panel-heading p{margin:0 0 7px;color:var(--green-650);font-size:13px;font-weight:700}
.panel-heading h2{margin:0 0 28px;font-size:23px;line-height:1.25}
form label{display:block;margin-bottom:9px;color:#45524c;font-size:14px;font-weight:650}
.password-field{display:grid;grid-template-columns:1fr auto;align-items:center;border:1px solid var(--line);border-radius:8px;background:#fbfdfc;transition:border-color .18s,box-shadow .18s}
.password-field:focus-within{border-color:var(--green-650);box-shadow:0 0 0 3px rgba(20,115,84,.12)}
.password-field input{width:100%;height:52px;min-width:0;border:0;outline:0;padding:0 14px;background:transparent;color:var(--ink);font-size:17px}
.password-field button{height:38px;margin-right:7px;padding:0 10px;border:0;background:transparent;color:var(--green-800);font-size:13px;font-weight:700;cursor:pointer}
.message{min-height:22px;margin:8px 2px 4px;color:#b53c34;font-size:13px}
.submit{width:100%;height:52px;border:1px solid #09553d;border-radius:8px;background:linear-gradient(180deg,#117252,#07543d);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 8px 18px rgba(5,73,51,.2);color:#fff;font-size:16px;font-weight:750;cursor:pointer}
.submit:active{transform:translateY(1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 4px 10px rgba(5,73,51,.18)}
.submit:disabled{opacity:.7;cursor:wait}
.retention{margin:18px 0 0;text-align:center;color:var(--muted);font-size:13px}
@media(min-width:700px){body{padding:24px}.login-shell{min-height:calc(100vh - 48px);border-radius:18px;overflow:hidden}.login-hero{border-radius:18px 18px 0 0}}
@media(max-width:370px){.login-hero{padding-left:21px;padding-right:21px}.security-chip{left:21px}.login-panel{padding-left:21px;padding-right:21px}.brand h1{font-size:28px}}