:root{color-scheme:light;--ink:#1b1d2a;--jade:#028701;--blue:#005cfe}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:#eff6f3;color:var(--ink);font:1rem/1.55 system-ui,sans-serif}
main{margin:clamp(1rem,7vh,5rem) auto;max-width:34rem;width:calc(100% - 2rem);background:white;padding:clamp(1.3rem,5vw,2.5rem);border:1px solid #d6e6e0;border-radius:1.25rem}
header{display:flex;align-items:center;gap:.65rem;color:var(--jade);font:1.8rem Georgia,serif}
header small{background:#edf2ff;color:#39499e;padding:.2rem .55rem;border-radius:.75rem;font:700 .7rem system-ui}
h1{margin:.9rem 0 .25rem;font-size:clamp(1.7rem,6vw,2.4rem);line-height:1.1}
p{margin:.7rem 0 1rem}
label{display:block;font-weight:650;margin-top:1rem}
input{display:block;width:100%;padding:.7rem;border:1px solid #7e8a86;border-radius:.5rem;font:inherit}
.hint,#status{font-size:.9rem}
button,.button{display:inline-block;padding:.72rem 1rem;border:0;border-radius:.6rem;background:var(--jade);color:white;font:650 1rem system-ui;text-decoration:none;cursor:pointer;margin-top:.7rem}
button:disabled{opacity:.6;cursor:wait}
.plain{background:white;color:var(--jade);padding-left:0;text-decoration:underline}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
h3{margin-bottom:0}

header img.wordmark{width:min(190px,48vw);height:auto}header img{flex-shrink:0}