:root {
  font-family:Segoe UI,Arial,sans-serif;
  color:#263a31;
  background:#f5f3ec;
  color-scheme:light
}
* {
  box-sizing:border-box
}
body {
  margin:0;
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:30px;
  background:radial-gradient(ellipse at 15% 10%,#e6eddd,transparent 55%),radial-gradient(ellipse at 90% 90%,#f4e7d4,transparent 50%)
}
main {
  width:min(440px,100%);
  padding:48px;
  background:#fffef9;
  border:1px solid #e2e3d7;
  border-radius:24px;
  box-shadow:0 20px 90px #34452b0b
}
.mark {
  background:#254b3e;
  color:#fff;
  font:bold 40px Georgia;
  width:70px;
  height:70px;
  border-radius:20px;
  display:grid;
  place-items:center;
  margin-bottom:36px
}
.eyebrow {
  font-size:11px;
  letter-spacing:2px;
  font-weight:700;
  color:#6e7964
}
h1 {
  font:36px Georgia;
  margin:14px 0
}
.intro {
  color:#748074;
  margin-bottom:36px
}
label {
  display:block;
  font-size:13px;
  font-weight:600;
  margin-bottom:10px
}
input {
  width:100%;
  padding:14px;
  border:1px solid #cbd2c6;
  border-radius:10px;
  font-size:18px;
  background:#fff
}
button {
  width:100%;
  margin-top:18px;
  padding:15px 18px;
  border:0;
  border-radius:10px;
  background:#254b3e;
  color:white;
  font:600 15px Segoe UI;
  cursor:pointer;
  display:flex;
  justify-content:space-between
}
button:hover {
  background:#34634f
}
input:focus-visible,button:focus-visible {
  outline:3px solid #c5a76a;
  outline-offset:3px
}
.foot {
  margin:30px 0 0;
  font-size:12px;
  color:#879083
}
#error {
  font-size:13px;
  color:#ac352e
}