:root{--bg:#060a12;--card:#111a2b;--line:#2b3a55;--text:#e9f0fb;--muted:#9cb1cf;--a:#2ea6ff;--b:#31d5ff;--ok:#22c55e;--danger:#ef4444}
*{box-sizing:border-box}html,body{margin:0;padding:0;font-family:Inter,system-ui;background:var(--bg);color:var(--text)}
.bg{position:fixed;inset:0;pointer-events:none;background:radial-gradient(700px 350px at 80% -10%,#0ea5e933,transparent 60%),radial-gradient(500px 320px at 10% 110%,#2563eb2b,transparent 60%)}
.page{min-height:100vh;display:grid;place-items:center;padding:24px}
.panel{width:min(760px,100%);background:linear-gradient(180deg,#111b2df0,#0d1524f0);border:1px solid var(--line);border-radius:22px;padding:28px;box-shadow:0 30px 80px #0008}
.brand{font-size:12px;letter-spacing:.2em;color:var(--b);font-weight:700}
h1{margin:10px 0 8px;font-size:clamp(1.6rem,3.2vw,2.5rem);line-height:1.15}.desc{margin:0;color:var(--muted)}
.steps{margin-top:16px;padding:14px;border:1px solid #2a3a57;background:#0b1322;border-radius:14px}
.steps h2{margin:0 0 8px;font-size:1rem}.steps ul{margin:0;padding-left:18px;color:var(--muted);display:grid;gap:6px}
.form{margin-top:16px}label{display:block;margin-bottom:8px;font-weight:600}
input{width:100%;height:48px;border-radius:12px;border:1px solid #344967;background:#091224;color:#fff;padding:0 14px;font-size:.98rem;outline:none}
input:focus{border-color:var(--a);box-shadow:0 0 0 3px #38bdf822}
button{border:0;cursor:pointer}
#requestBtn{width:100%;height:50px;margin-top:12px;border-radius:12px;background:linear-gradient(90deg,var(--a),var(--b));color:#04101c;font-weight:800;box-shadow:0 12px 28px #0ea5e94a}
#requestBtn:disabled{opacity:.65;cursor:not-allowed}.foot{margin:10px 2px 0;color:#8ba3c7;font-size:.85rem}
.modal{position:fixed;inset:0;background:#020617cc;display:grid;place-items:center;padding:16px;z-index:50}.hidden{display:none!important}
.modal-card{width:min(460px,96vw);background:#0c1525;border:1px solid #314761;border-radius:16px;padding:16px}
.modal-head{display:flex;align-items:center;justify-content:space-between}.modal-head h3{margin:0}.close-btn{width:34px;height:34px;border-radius:10px;background:#13223a;color:#dbeafe;border:1px solid #334a67}
.dots{display:flex;gap:7px;margin:8px 0 4px}.dots span{width:8px;height:8px;border-radius:99px;background:#355579;animation:p 1.2s infinite ease-in-out}.dots span:nth-child(2){animation-delay:.2s}.dots span:nth-child(3){animation-delay:.4s}
#modalText{margin:8px 0 0;color:var(--muted)}
#codeBox{margin:12px 0 0;padding:12px;border-radius:12px;border:1px solid #3e5f89;background:#0a1628;color:#befee7;text-align:center;font-size:clamp(1.3rem,5vw,1.9rem);letter-spacing:.32em;font-weight:800}
.copy-btn{margin-top:10px;width:100%;height:42px;border-radius:10px;background:#13233d;color:#dbeafe;border:1px solid #335075;font-weight:700;cursor:pointer}
.copy-btn:hover{filter:brightness(1.08)}
.toast{position:fixed;right:16px;bottom:16px;background:#0f172a;border:1px solid #334155;color:#e2e8f0;padding:10px 12px;border-radius:10px;z-index:60;max-width:min(90vw,420px);font-size:.92rem}
.toast.err{border-color:#7f1d1d;background:#1a0d0d;color:#fecaca}
@keyframes p{0%,100%{opacity:.35;transform:translateY(0)}50%{opacity:1;transform:translateY(-1px);background:var(--b)}}