:root { font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #172b4d; background: #f4f5f7; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; display: grid; place-items: center; }
main { width: min(400px, calc(100% - 32px)); }
form { padding: 30px; background: #fff; border: 1px solid #dfe1e6; border-radius: 8px; box-shadow: 0 8px 28px rgba(9,30,66,.14); }
.brand-mark { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 6px; background: #b98212; color: #fff; font-weight: 800; }
h1 { margin: 20px 0 2px; font-size: 25px; letter-spacing: 0; }
p { margin: 0 0 24px; color: #5e6c84; }
label { display: block; margin-bottom: 6px; color: #5e6c84; font-size: 13px; font-weight: 700; }
input, button { width: 100%; min-height: 44px; border-radius: 5px; font: inherit; }
input { padding: 9px 11px; border: 1px solid #b3bac5; outline: 0; }
input:focus { border-color: #0c66e4; box-shadow: 0 0 0 2px rgba(12,102,228,.18); }
button { margin-top: 14px; border: 1px solid #0c66e4; background: #0c66e4; color: #fff; font-weight: 700; cursor: pointer; }
#error { min-height: 22px; margin-top: 10px; color: #ae2e24; font-size: 13px; }