:root{--paper:#f7f2e8;--card:#fffdf8;--ink:#213d32;--soft:#5a685f;--green:#24483a;--orange:#d77b5a;--red:#b6452c;--line:rgba(33,61,50,.22)}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;display:grid;place-items:center;padding:1.25rem;background:var(--paper);color:var(--ink);font-family:"Avenir Next",Avenir,ui-sans-serif,system-ui,sans-serif}
form{width:min(360px,100%);display:flex;flex-direction:column;gap:1rem;padding:2rem 1.75rem;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 12px 40px rgba(33,61,50,.1)}
img{align-self:center;transform:rotate(-8deg)}
h1{margin:0 0 .25rem;text-align:center;font:400 1.5rem/1.2 Georgia,"Times New Roman",serif;letter-spacing:-.03em}
h1 em{color:var(--orange)}
label{font-size:.78rem;font-weight:700;color:var(--soft);margin-bottom:-.6rem}
input{font:inherit;font-size:.95rem;padding:.7rem .8rem;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink)}
input:focus,button:focus-visible{outline:2px solid #e9b477;outline-offset:1px}
button{font:inherit;font-weight:700;font-size:.92rem;padding:.8rem;border:0;border-radius:10px;background:var(--green);color:var(--paper);cursor:pointer;margin-top:.25rem}
button:hover{background:#18372e}
.error[hidden]{display:none}
.error{margin:0;padding:.65rem .8rem;border-radius:10px;background:#f7e0d8;color:var(--red);font-size:.85rem;font-weight:600}