:root {
  color-scheme: light;
  font: 16px/1.45 "Microsoft YaHei", system-ui, sans-serif;
  color: #12294b;
  background: #edf3ff;
}
* { box-sizing: border-box; }
body { margin: 0; padding: 1rem; }
main {
  width: min(100%, 25rem);
  margin: clamp(2rem, 13vh, 8rem) auto;
  padding: clamp(1.25rem, 6vw, 2rem);
  border: 1px solid #ccdcf7;
  border-radius: 1rem;
  background: #fff;
}
h1 { margin: 0 0 1.2rem; font-size: 1.6rem; }
form { display: grid; gap: .55rem; }
input, button { font: inherit; border-radius: .5rem; min-height: 2.75rem; }
input { border: 1px solid #9db3d5; padding: .5rem .7rem; width: 100%; }
button { border: 0; margin-top: .5rem; background: #0047ab; color: #fff; cursor: pointer; }
a { color: #0047ab; }
:focus-visible { outline: 3px solid #0047ab; outline-offset: 3px; }
p[role="alert"] { color: #a12824; }