/* LOGIN */
#login{height:100vh;display:flex;align-items:center;justify-content:center;background:var(--side)}
#login .card{background:var(--surface);border:1px solid var(--hair);border-radius:12px;padding:36px;width:min(360px,92vw);box-shadow:0 1px 3px rgba(24,24,27,.05),0 12px 32px rgba(24,24,27,.07)}
.brand-logo{width:min(200px,64%);height:auto;display:block;margin:0 auto 18px}
#login h1{font-size:13.5px;color:var(--mut);font-weight:400;margin:0 0 24px}
.field{margin-bottom:14px}
.field label{display:block;font-size:12px;color:var(--mut);margin-bottom:6px;font-weight:500}
.field input,.field select,.field textarea{width:100%;padding:9px 12px;border:1px solid var(--hair2);border-radius:var(--r);font-size:14px;font-family:inherit;background:var(--surface);color:var(--ink)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.btn{background:var(--accent);color:#fff;border-radius:var(--r);padding:10px 22px;width:100%;font-size:14px;font-weight:600;transition:background .15s}
.btn:hover{background:var(--accent2)}
.btn.slim{width:auto;padding:8px 16px;font-size:13px}
.btn.ghost{background:var(--surface);color:var(--ink2);border:1px solid var(--hair2)}
.btn.ghost:hover{background:var(--hover)}
.btn[disabled]{opacity:.55;cursor:default}
.err{color:var(--risk);font-size:12px;margin-top:10px;min-height:16px}
.linkbtn{background:none;color:var(--mut);font-size:12px;margin-top:12px;text-decoration:underline;display:block;width:100%;text-align:center}
.linkbtn:hover{color:var(--accent)}
.field .hint{font-size:11px;color:var(--mut2);margin-top:6px}