:root {
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
  background: #0f1216;
  color: #edf1f5;
}

* { box-sizing: border-box; }
body { margin: 0; }
main { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
form { width: min(390px, 100%); padding: 24px; border: 1px solid #28303a; border-radius: 9px; background: #171b21; }
h1, p { margin: 0; }
h1 { font-size: 22px; }
p { margin-top: 7px; color: #9ca8b5; font-size: 13px; line-height: 1.4; }
label { display: grid; gap: 7px; margin-top: 20px; color: #aeb8c3; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; }
input { padding: 10px; color: inherit; background: #0f1216; border: 1px solid #303944; border-radius: 5px; font: inherit; }
button { width: 100%; margin-top: 14px; padding: 10px; color: #fff; background: #2f6feb; border: 0; border-radius: 6px; font: inherit; cursor: pointer; }
#error { min-height: 20px; color: #ff7d85; }