*{box-sizing:border-box}
body{margin:0;background:#eef3f8;font-family:Arial,Helvetica,sans-serif;color:#101828}
.app{max-width:980px;margin:30px auto;padding:16px}
.app.wide{max-width:1250px}
.panel{background:#fff;border-radius:22px;padding:26px;box-shadow:0 20px 45px rgba(15,47,87,.12)}
.brand{font-weight:900;letter-spacing:.16em;color:#184b83;font-size:13px}
h1{font-size:34px;margin:8px 0 12px}
.lead{font-size:18px;color:#667085;line-height:1.5}
.drop{display:block;border:2px dashed #9fb5d1;background:#f8fbff;border-radius:18px;padding:30px;text-align:center;margin:22px 0}
.drop span{display:block;color:#667085;margin-top:8px}
.drop input{display:block;margin:18px auto 0}
button,.big{border:0;border-radius:14px;background:#0f2f57;color:white;padding:15px 18px;font-size:17px;font-weight:900;cursor:pointer;width:100%}
.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.box{border:1px solid #d8e1ee;background:#fbfdff;border-radius:16px;padding:16px;margin:16px 0}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
label{display:block;font-weight:800;font-size:13px}
input,textarea{width:100%;border:1px solid #cfd8e3;border-radius:10px;padding:10px;font-size:15px;margin-top:5px}
.roles{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.roles label{background:#fff;border:1px solid #d8e1ee;border-radius:12px;padding:10px}
.span2{grid-column:span 2}
.warn{white-space:pre-line;background:#fff8e6;border-left:5px solid #ffb020;padding:12px;border-radius:12px;margin:14px 0}
@media(max-width:850px){.two,.grid{grid-template-columns:1fr}.span2{grid-column:span 1}}