* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; display: grid; place-items: center; background: #fff; color: #1d1d1b;
  font: 16px/1.45 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }
main { width: min(360px, 88vw); padding: 24px 0 64px; }
img { display: block; margin: 0 0 16px; }
h1 { font-size: 22px; font-weight: 600; margin: 0 0 20px; }
label { display: block; font-size: 14px; font-weight: 600; margin: 14px 0 6px; }
input { width: 100%; font: inherit; padding: 12px; border: 1px solid #c8c6c0; border-radius: 8px; background: #fff; color: inherit; }
input:focus { outline: 3px solid #57a8cc; outline-offset: 1px; border-color: #256f8e; }
button { margin-top: 22px; width: 100%; min-height: 48px; font: inherit; font-weight: 600; border: 0; border-radius: 8px; background: #256f8e; color: #fff; cursor: pointer; }
button:hover { background: #1f6584; }
button:focus-visible { outline: 3px solid #57a8cc; outline-offset: 2px; }
.err { color: #9a3412; font-size: 15px; margin: 14px 0 0; }
.note h1 { font-size: 20px; }
a { color: #256f8e; }