@font-face{font-family:'Antonio';font-weight:100 700;font-display:swap;src:url(fonts/antonio.woff2) format('woff2')}
@font-face{font-family:'Barlow Semi Condensed';font-weight:400;font-display:swap;src:url(fonts/barlow-400.woff2) format('woff2')}
@font-face{font-family:'Barlow Semi Condensed';font-weight:500;font-display:swap;src:url(fonts/barlow-500.woff2) format('woff2')}

:root{--orange:#FF9933;--peach:#FFCC99;--lavender:#CC99CC;--blue-violet:#9999FF;--amber:#FFB35C;--rust:#E8644F;--text:#E8E4DA;--muted:#B9B5C6}
*{box-sizing:border-box}
html,body{margin:0;background:#000;color:var(--text);font-family:'Barlow Semi Condensed',system-ui,sans-serif}
.ant{font-family:'Antonio',sans-serif;text-transform:uppercase}
.mono{font-family:'JetBrains Mono',Consolas,monospace}
[hidden]{display:none !important}
button{font:inherit;cursor:pointer;border:0;margin:0}
button:disabled{cursor:not-allowed}
button:focus-visible,input:focus-visible{outline:2px solid var(--cyan,#5BE7FF);outline-offset:3px}
input::placeholder{color:#8F8CA0}

.lg{min-height:100vh;min-height:100dvh;max-width:480px;margin:0 auto;display:flex;flex-direction:column;padding:calc(12px + env(safe-area-inset-top)) 0 calc(12px + env(safe-area-inset-bottom))}
.bars{display:flex;gap:5px}
.bars.top{height:18px}
.bars.bottom{height:14px;margin-top:18px}
.bars i{display:block}
.b1{flex:0 0 150px;background:var(--orange);border-top-left-radius:18px}
.b2{flex:0 0 64px;background:var(--peach)}
.b3{flex:1;background:var(--lavender)}
.b4{flex:0 0 36px;background:var(--blue-violet);border-radius:0 9px 9px 0}
.c1{flex:0 0 110px;background:var(--lavender);border-bottom-left-radius:14px}
.c2{flex:1;background:var(--peach)}
.c3{flex:0 0 44px;background:var(--orange);border-radius:0 7px 7px 0}

.form{flex:1;display:flex;flex-direction:column;padding:40px 24px 0;gap:18px}
h1{margin:0;font-size:56px;font-weight:700;letter-spacing:.14em;color:var(--orange);line-height:1}
.sub{font-size:15px;letter-spacing:.16em;color:var(--muted);margin-top:8px}
.field{display:flex;flex-direction:column;gap:6px}
label{font-size:13px;letter-spacing:.14em;color:var(--peach)}
input{height:52px;padding:0 16px;background:#0B0B11;border:2px solid #34344A;border-radius:0 26px 26px 0;color:#F4F0E6;font:inherit;font-size:19px;width:100%}
input.mono{font-size:22px;letter-spacing:.5em}
input[readonly]{opacity:.55}

.note{display:flex;flex-direction:column;gap:2px;padding:10px 14px;background:#1A0F0B;border-left:10px solid var(--rust);border-radius:0 18px 18px 0;font-size:17px;color:#F5D6CE}
.note.amber{background:#1A1306;border-left-color:var(--amber);color:#FFE6CC}
.note.amber span+span{font-size:15px;color:#E6C9A6}

.go{height:54px;border-radius:27px;background:var(--orange);color:#000;font-size:19px;font-weight:700;letter-spacing:.16em;display:flex;align-items:center;justify-content:center;gap:10px}
.go:disabled{background:#2A2A38;color:#8F8CA0}
.go.busy:disabled{background:var(--orange);color:#000}
.spin{display:inline-block;width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion: reduce){.spin{animation:none}}