:root{color:#172033;background:#f3f6fb;font-family:Inter,system-ui,sans-serif}*{box-sizing:border-box}body{margin:0}.page{place-items:center;min-height:100vh;padding:24px;display:grid}.card{background:#fff;border-radius:20px;width:min(680px,100%);padding:36px;box-shadow:0 16px 50px #1c2b4a18}.eyebrow{color:#3b6df6;letter-spacing:.08em;text-transform:uppercase;font-weight:700}h1{margin:8px 0;font-size:32px}.muted{color:#718096}label{margin:28px 0 8px;font-weight:600;display:block}input{border:1px solid #d8deea;border-radius:10px;width:100%;padding:13px 14px;font-size:16px}select{background:#fff;border:1px solid #d8deea;border-radius:10px;width:100%;padding:13px 14px;font-size:16px}button{color:#fff;cursor:pointer;background:#3b6df6;border:0;border-radius:10px;margin-top:16px;padding:13px 18px;font-weight:700}.roles{gap:10px;margin-top:28px;display:grid}.role{border:1px solid #e5eaf2;border-radius:10px;justify-content:space-between;align-items:center;gap:16px;padding:14px;display:flex}.role span{color:#718096;margin-top:4px;font-size:14px;display:block}.danger{background:#b42318;margin:0}button:disabled{opacity:.6;cursor:wait}pre{white-space:pre-wrap;border-radius:10px;margin-top:24px;padding:16px;overflow:auto}.result{background:#f5f8ff}.error{color:#b42318;background:#fff1f1}