:root { color-scheme:light dark; font-family:system-ui,sans-serif; }
body { margin:0; min-height:100dvh; display:grid; place-items:center;
  color:light-dark(#243a2e,#e8f2eb); background:light-dark(#eff4ed,#17231c); }
main { box-sizing:border-box; width:min(calc(100% - 32px), 400px); padding:24px;
  border:1px solid light-dark(#cbd9cc,#405648); border-radius:16px;
  background:light-dark(#fff,#202c25); }
h1 { margin:0 0 20px; }
form, label { display:grid; gap:8px; }
form { gap:16px; }
input, button { box-sizing:border-box; min-width:0; min-height:44px; border:1px solid light-dark(#b2c4b4,#53695a);
  border-radius:8px; padding:8px 12px; font:inherit; }
button { background:light-dark(#325c45,#bbd8bd); color:light-dark(white,#193522); cursor:pointer; }
p { margin:0; }
p:empty { display:none; }