:root { color-scheme: light dark; font-family: system-ui, sans-serif; line-height: 1.5; }
body { margin: 0; min-height: 100svh; display: grid; place-items: center; background: light-dark(#f6f8f5, #151b18); color: light-dark(#182c20, #eff5f0); }
main { box-sizing: border-box; width: min(100%, 32rem); padding: clamp(1.25rem, 5vw, 3rem); }
h1 { font-size: 1.65rem; line-height: 1.2; }
form, label { display: grid; gap: .5rem; }
form { gap: 1.25rem; margin: 1.5rem 0; }
input, button { box-sizing: border-box; width: 100%; min-height: 2.75rem; padding: .7rem; font: inherit; border: 1px solid light-dark(#748b7a, #789982); border-radius: .4rem; }
button { background: light-dark(#155d36, #93dbab); color: light-dark(#fff, #112919); font-weight: 650; cursor: pointer; overflow-wrap: anywhere; }
:focus-visible { outline: 3px solid light-dark(#235fbc, #a5c5ff); outline-offset: 3px; }
.quiet { font-size: .85rem; color: light-dark(#4d6254, #b2c4b7); }
a { color: light-dark(#155d36, #93dbab); }