*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#f4f2fa;color:#222}
header{display:flex;align-items:center;justify-content:space-between;background:#3c2d7b;color:#fff;padding:10px 20px}
.brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-size:22px}.brand b{color:#05bbdb}
header form{display:flex;align-items:center;gap:12px;margin:0}.who{font-size:14px;opacity:.85}
header button{background:#fff;color:#3c2d7b;border:0;border-radius:4px;padding:7px 14px;font-size:14px;cursor:pointer}
main{padding:24px 16px}.card{max-width:380px;margin:40px auto;background:#fff;border-radius:8px;padding:26px 24px;box-shadow:0 2px 12px rgba(0,0,0,.12)}
h1{font-size:21px;margin:0 0 6px;color:#2b1c78}.sub{color:#666;margin:0 0 16px;font-size:14px}.err{background:#fde8e8;color:#b02020;padding:8px 10px;border-radius:4px;font-size:14px}
label{display:block;font-size:14px;margin:12px 0 0;color:#444}input{display:block;width:100%;margin-top:5px;padding:10px;border:1px solid #bbb;border-radius:4px;font-size:15px}
.go{width:100%;margin-top:18px;padding:11px;background:#3c2d7b;color:#fff;border:0;border-radius:4px;font-size:16px;cursor:pointer}.go:hover{background:#05bbdb}
.wrap{max-width:960px;margin:0 auto}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.grid a{display:block;padding:18px 10px;text-align:center;background:#3c2d7b;color:#fff;text-decoration:none;border-radius:6px;font-size:16px}.grid a:hover{background:#05bbdb}