*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#f4f6fb;color:#0e1630;font:17px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
main{max-width:520px;margin:0 auto;padding:max(28px,env(safe-area-inset-top)) 20px max(40px,env(safe-area-inset-bottom))}
.brand{font-weight:800;font-size:20px;letter-spacing:-.01em;color:#316cff;margin-bottom:28px}
h1{font-size:30px;line-height:1.15;margin:0 0 10px}
h2{font-size:19px;margin:0 0 8px}
p{margin:0 0 14px}
.lead{font-size:18px;color:#3a4566}
section{background:#fff;border:1px solid #dde3f3;border-radius:16px;padding:18px;margin:0 0 16px}
label{display:block;font-weight:600;margin:0 0 14px}
input{display:block;width:100%;margin-top:6px;padding:14px;font:inherit;border:1px solid #c5cee6;border-radius:12px;background:#fff;color:#0e1630}
input:focus,button:focus-visible,summary:focus-visible{outline:3px solid #316cff;outline-offset:2px}
.btn{display:inline-block;width:100%;padding:16px 18px;margin:6px 0;border:0;border-radius:14px;background:#316cff;color:#fff;font-weight:700;font-size:18px;font-family:inherit;cursor:pointer}
.btn.ghost{background:#e6ecff;color:#1f3fae}
.btn[disabled]{opacity:.55;cursor:default}
#codes .btn{width:auto;padding:14px 18px}
.msg{min-height:1.5em;margin:12px 0;font-weight:600}
.msg.bad{color:#b3261e}
.warn{background:#fff4dc;border:1px solid #f0cf85;border-radius:12px;padding:12px 14px}
details{margin-top:22px}
summary{cursor:pointer;color:#1f3fae;font-weight:600;padding:8px 0}
.list{list-style:none;margin:0 0 14px;padding:0}
.list li{padding:8px 0;border-bottom:1px solid #eef1f9}
.codes{font:700 20px/1.9 ui-monospace,SFMono-Regular,Menlo,monospace;padding-left:30px;margin:10px 0 18px}
[hidden]{display:none!important}