:root{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;color:#18362f;background:#edf6f3;font-synthesis:none}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:linear-gradient(155deg,#e7f4ef 0%,#f7faf8 56%,#edf5f2 100%)}
.page{width:min(100% - 32px,440px);margin:0 auto;padding:60px 0 36px}
.brand{display:flex;align-items:center;gap:10px;margin:0 4px 20px;color:#125c50;font-size:18px;font-weight:700;letter-spacing:.03em}
.brand-mark{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:#146e61;color:white;font-size:19px;font-weight:800}
.login-card{padding:34px;background:white;border:1px solid #deebe6;border-radius:20px;box-shadow:0 16px 46px rgba(30,81,66,.08)}
.intro .eyebrow{margin:0 0 9px;color:#328473;font-size:13px;font-weight:650;letter-spacing:.04em}
h1{margin:0;color:#163a30;font-size:27px;line-height:1.25}
.intro>p:last-child{margin:10px 0 27px;color:#6a8078;font-size:14px;line-height:1.6}
.roles{border:0;margin:0 0 20px;padding:0}
.roles legend,.field{display:block;padding:0;margin:0 0 9px;color:#294a40;font-size:14px;font-weight:650}
.role-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.role-option{position:relative;cursor:pointer}
.role-option input{position:absolute;opacity:0;width:1px;height:1px}
.role-option span{display:grid;place-items:center;min-height:46px;padding:8px 3px;border:1px solid #d8e5df;border-radius:9px;color:#4b675c;font-size:14px;white-space:nowrap;transition:border-color .15s,background .15s,color .15s}
.role-option input:checked+span{border-color:#208473;background:#e8f6f1;color:#126a5c;font-weight:700}
.role-option input:focus-visible+span{outline:3px solid #9ad8c9;outline-offset:2px}
input[type=text],input[type=password]{display:block;width:100%;height:48px;margin:0 0 19px;padding:0 13px;border:1px solid #d5e1dc;border-radius:9px;background:#fff;color:#172f27;font:inherit;font-size:15px;outline:none}
input[type=text]:focus,input[type=password]:focus{border-color:#208473;box-shadow:0 0 0 3px #d9f2e9}
input::placeholder{color:#a0afa8}
.field-hint{margin:-12px 0 19px;color:#526b61;font-size:12px;line-height:1.5}
.password-field{position:relative}
.password-field input{padding-right:62px}
.password-toggle{position:absolute;right:4px;top:4px;min-width:52px;height:40px;border:0;border-radius:7px;background:transparent;color:#146e61;font:inherit;font-size:14px;font-weight:650;cursor:pointer}
.password-toggle:focus-visible{outline:3px solid #9ad8c9;outline-offset:-3px}
.password-toggle[hidden]{display:none}
.error{margin:-3px 0 14px;color:#b42318;font-size:14px;line-height:1.5}
.submit{width:100%;height:48px;border:0;border-radius:9px;background:#147563;color:white;font:inherit;font-size:16px;font-weight:700;cursor:pointer}
.submit:hover{background:#0d6354}.submit:disabled{opacity:.65;cursor:wait}
.registration{margin-top:23px;padding-top:19px;border-top:1px solid #e8f0ec;color:#526b61;font-size:14px;line-height:1.6}
.registration p{margin:0 0 8px}.registration-links{display:flex;gap:8px 18px;flex-wrap:wrap}.registration .registration-hint{margin:10px 0 0;font-size:12px;color:#647c71}
a{color:#147563;text-decoration:none;font-weight:650}a:hover{text-decoration:underline}
.footer{text-align:center;margin:21px 0 0;color:#8ba097;font-size:12px;line-height:1.5}
@media(max-width:420px){.page{padding-top:32px}.login-card{padding:28px 20px}.role-options{gap:7px}.role-option span{font-size:13px}}