:root { color-scheme: light; font-family: Inter, ui-sans-serif, system-ui, sans-serif; color: #281c20; background: #f6efe7; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 32px 18px; background: radial-gradient(circle at top, #fff 0, #f6efe7 58%, #ead9cd 100%); }
main { width: min(760px, 100%); background: #fffdfa; border: 1px solid #dfcdc2; border-radius: 24px; padding: clamp(24px, 5vw, 52px); box-shadow: 0 24px 60px #5c233421; }
.eyebrow { color: #8d5a38; font-weight: 800; letter-spacing: .18em; font-size: .76rem; }
h1 { font-family: Georgia, serif; font-size: clamp(2.2rem, 6vw, 4rem); line-height: 1; margin: .2em 0; color: #5c2334; }
.lede { color: #66565a; font-size: 1.08rem; max-width: 60ch; }
form { display: grid; gap: 20px; margin-top: 30px; }
fieldset { border: 1px solid #e2d5cc; border-radius: 16px; padding: 20px; display: grid; gap: 14px; }
legend { padding: 0 8px; color: #5c2334; font-weight: 800; }
label { display: grid; gap: 7px; font-weight: 700; }
input, select { width: 100%; border: 1px solid #bca9a0; border-radius: 10px; padding: 12px; font: inherit; background: white; }
.check { grid-template-columns: auto 1fr; align-items: center; font-weight: 500; }
.check input { width: auto; }
.note, #status { margin: 0; color: #725f65; font-size: .9rem; }
button { border: 0; border-radius: 999px; padding: 15px 22px; background: #5c2334; color: white; font: inherit; font-weight: 800; cursor: pointer; }
button:hover { background: #762e43; }
#status { color: #9a1f32; font-weight: 700; }