:root { color-scheme: light; font: 100% system-ui, sans-serif; color: #132739; background: #f2f5f8; }
* { box-sizing: border-box; }
body { margin: 0; }
main { width: min(100%, 38rem); margin: auto; padding: 1.2rem; }
.eyebrow { color: #315168; font-size: .85rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
h1 { line-height: 1.2; margin: .35rem 0 .9rem; font-size: clamp(1.55rem, 6vw, 2.15rem); }
h2 { font-size: 1.2rem; }
section { display: grid; gap: .7rem; }
form, article, fieldset { display: grid; gap: .7rem; border: 1px solid #c5d3de; background: #fff; border-radius: .65rem; padding: .85rem; min-width: 0; }
p { line-height: 1.55; margin: .25rem 0; }
label { display: grid; gap: .25rem; }
input:not([type=checkbox]), textarea, button { width: 100%; min-height: 2.8rem; font: inherit; padding: .55rem .7rem; border: 1px solid #55788f; border-radius: .45rem; }
textarea { resize: vertical; }
button { color: #fff; background: #174568; cursor: pointer; font-weight: 650; }
button.secondary { background: #fff; color: #174568; }
button:disabled { opacity: .65; cursor: wait; }
.choice { display: flex; align-items: center; gap: .55rem; min-height: 2.8rem; }
.choice input { width: 1.1rem; height: 1.1rem; flex: 0 0 auto; }
button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 3px solid #bc5b11; outline-offset: 2px; }
#status:not(:empty) { color: #9b2b22; margin-bottom: .75rem; }