:root{color-scheme:dark;font-family:system-ui,sans-serif;background:#101819;color:#e4edeb}
[hidden]{display:none!important}
*{box-sizing:border-box}body{margin:0;padding:48px 20px}main{max-width:540px;margin:auto;padding:32px;border:1px solid #344746;border-radius:18px;background:#172323}
.brand{font-size:12px;letter-spacing:3px;color:#a6d8c9}h1{font-size:30px;margin:16px 0}p{line-height:1.6;color:#c4d1ce}label{display:block;margin:24px 0 8px;font-weight:600}
input{width:100%;padding:13px;border-radius:8px;border:1px solid #506460;background:#101819;color:#e4edeb;font:inherit}button{width:100%;margin-top:24px;border:0;border-radius:8px;padding:14px;background:#b8e4d4;color:#10221b;font:inherit;font-weight:700;cursor:pointer}
button:disabled{opacity:.6;cursor:wait}input:focus-visible,button:focus-visible{outline:3px solid #d6f7e8;outline-offset:3px}.note{font-size:13px;color:#94aaa4}#result{overflow-wrap:anywhere}#result[data-error="true"]{color:#ffc1b9}