*{box-sizing:border-box}body{margin:0;background:#f3f5f0;color:#21382b;font:16px/1.5 system-ui,sans-serif}main{max-width:32rem;margin:7vh auto;padding:1rem}header{font-size:1.35rem;font-weight:700;padding:.5rem}header span{margin-left:1rem;font-size:.875rem;font-weight:500;color:#54665a}section{border:1px solid #cdd8cc;border-radius:1rem;background:white;padding:clamp(1.2rem,5vw,2.5rem)}h1{margin:0;font-size:1.8rem}p{color:#475b4e}label{display:block;margin:1rem 0}input,button{width:100%;padding:.8rem;font:inherit;border-radius:.45rem}input{display:block;margin-top:.25rem;border:1px solid #7d8f82}button{border:0;background:#274d35;color:white;cursor:pointer}button:disabled{opacity:.65}#status:empty{display:none}
article{border-top:1px solid #cdd8cc;padding:1rem 0}article a{display:block;color:#214e34;margin:1rem 0}article button,#logout{margin-top:.65rem}textarea{display:block;width:100%;font:inherit}h2{overflow-wrap:anywhere}
dialog{width:min(90vw,28rem);border:1px solid #cdd8cc;border-radius:1rem;padding:1.5rem;color:#21382b}dialog::backdrop{background:#14261ca8}dialog button{margin-top:.5rem}