body{margin:0;min-height:100vh;background:#06070B;color:#FFFFFF;font-family:'Inter',system-ui,sans-serif;font-optical-sizing:auto}
.stage{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;box-sizing:border-box;background:radial-gradient(60% 50% at 70% 30%,rgba(196,112,44,.18),rgba(6,7,11,0) 70%),radial-gradient(50% 60% at 20% 80%,rgba(60,70,110,.18),rgba(6,7,11,0) 70%)}
.card{position:relative;width:100%;max-width:320px;display:flex;flex-direction:column;align-items:stretch;gap:14px;padding:32px 28px 26px;border-radius:32px;background:rgba(40,44,60,.22);-webkit-backdrop-filter:blur(30px) saturate(180%);backdrop-filter:blur(30px) saturate(180%);border:1px solid rgba(255,255,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 30px 80px rgba(0,0,0,.45)}
.mark{align-self:center;width:44px;height:60px;border-radius:14px;border:1px solid rgba(255,255,255,.3);overflow:hidden;position:relative;margin-bottom:4px}
.mark-fill{position:absolute;left:0;right:0;top:0;height:55%;background:rgba(196,112,44,.7);border-bottom:2px solid #FFD8A3}
h1{margin:0 0 6px;text-align:center;font-size:22px;font-weight:600;letter-spacing:-0.02em}
input{height:48px;border-radius:24px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:#FFFFFF;font:500 16px 'Inter',system-ui,sans-serif;padding:0 18px;outline:none}
input::placeholder{color:rgba(255,255,255,.6)}
input:focus-visible{border-color:#FFD8A3;box-shadow:0 0 0 3px rgba(255,216,163,.25)}
button{height:48px;border-radius:24px;border:0;background:#E39A45;color:#1A1206;font:600 16px 'Inter',system-ui,sans-serif;cursor:pointer;transition:transform .15s}
button:active{transform:scale(.97)}
button:focus-visible{outline:2px solid #FFFFFF;outline-offset:3px}
.err{min-height:18px;margin:0;text-align:center;font-size:14px;color:#FFC9A6}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}