* { box-sizing: border-box; }
body { margin: 0; background: #f4f6fa; color: #19253b; font: 16px/1.5 system-ui, sans-serif; }
main { max-width: 800px; margin: 2rem auto; padding: 0 1rem; }
section, article { background: white; border: 1px solid #dbe1eb; border-radius: 8px; padding: 1rem; margin: 1rem 0; }
article { background: #f9fbfe; }
h1 { margin-bottom: .25rem; }
h2 { margin-top: 0; font-size: 1.2rem; }
.note { color: #56657c; }
label { display: block; font-weight: 600; margin: .75rem 0 .25rem; }
input, select, textarea { display: block; width: 100%; padding: .6rem; border: 1px solid #9aa9bc; border-radius: 5px; font: inherit; }
button { margin: .8rem .5rem 0 0; background: #174c91; color: white; border: 0; border-radius: 5px; padding: .6rem 1rem; cursor: pointer; font: inherit; }
button:disabled { background: #96a2b1; cursor: not-allowed; }
button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline: 3px solid #569de3; }
article p { margin: .4rem 0; overflow-wrap: anywhere; }
[hidden] { display: none !important; }
