.modal-backdrop{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:20px;background:rgba(18,59,54,.52)}
.modal-backdrop[hidden]{display:none}
.modal{position:relative;width:min(100%,460px);background:#fff;border-radius:16px;padding:28px;box-shadow:0 24px 70px rgba(18,59,54,.3)}
.modal h2{margin:8px 0 20px;color:#183b36;font-size:24px}.modal-close{position:absolute;right:16px;top:12px;border:0;background:transparent;color:#71807d;font-size:27px;cursor:pointer}.modal form{display:grid;gap:13px}.modal label{display:grid;gap:6px;color:#536d65;font-size:12px;font-weight:700}.modal input,.modal select,.modal textarea{font:inherit;border:1px solid #dfe7e2;border-radius:8px;padding:11px;outline:0;color:#183b36}.modal textarea{resize:vertical}.modal .primary{margin-top:5px}
.auth-screen{min-height:100vh;display:grid;place-items:center;background:#f5f7f5;padding:20px}.auth-screen[hidden]{display:none}.auth-card{width:min(100%,410px);background:#fff;border:1px solid #dfe7e2;border-radius:18px;padding:36px;box-shadow:0 20px 60px rgba(18,59,54,.1)}.auth-card>.brand-mark{display:grid;margin-bottom:24px}.auth-card h1{color:#183b36;font-size:27px;margin:9px 0}.auth-card p{color:#71807d;line-height:1.5;margin:0 0 25px}.auth-card form{display:grid;gap:14px}.auth-card label{display:grid;gap:6px;color:#536d65;font-size:12px;font-weight:700}.auth-card input{font:inherit;border:1px solid #dfe7e2;border-radius:8px;padding:12px;outline:0}.login-error{min-height:18px;color:#b55245;font-size:12px}.auth-card .primary{margin-top:4px}