:root{--bg:#0b1020;--card:rgba(255,255,255,0.06);--border:rgba(255,255,255,0.12);--text:#e8eefc;--muted:rgba(232,238,252,0.72);--accent:#7c5cff;--accent2:#35c6ff;--r:18px}
*{box-sizing:border-box}
body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial;
  background:
    radial-gradient(1000px 520px at 20% 10%, rgba(124,92,255,0.22), transparent 55%),
    radial-gradient(900px 520px at 85% 90%, rgba(53,198,255,0.18), transparent 60%),
    url('./assets/img/ui_frame_gold_blue_1414x2000.png') center/cover no-repeat fixed,
    var(--bg);
  color:var(--text)
}
.wrap{min-height:100vh;display:grid;place-items:center;padding:28px}
.card{width:min(720px, 92vw);background:linear-gradient(180deg, rgba(5,10,24,0.78), rgba(5,10,24,0.60));border:1px solid var(--border);border-radius:var(--r);padding:22px 22px 18px;box-shadow:0 26px 70px rgba(0,0,0,0.35);backdrop-filter: blur(10px)}
.brand{display:flex;gap:12px;align-items:center;margin-bottom:12px}
.logo{width:54px;height:54px;border-radius:18px;
  background:
    url('./assets/img/astraverse_logo_1024.png') center/contain no-repeat,
    radial-gradient(circle at 25% 25%, rgba(124,92,255,0.22), transparent 55%),
    radial-gradient(circle at 80% 70%, rgba(53,198,255,0.18), transparent 60%),
    rgba(255,255,255,0.06);
  border:1px solid var(--border);
  box-shadow:0 18px 40px rgba(0,0,0,0.25)
}
.brandTitle{font-weight:950;letter-spacing:0.2px}
.brandTitle span{color:var(--accent2)}
.brandSub{color:var(--muted);font-size:12px;margin-top:2px}
h1{margin:10px 0 8px;font-size:22px;letter-spacing:-0.02em}
.muted{margin:0 0 14px;color:var(--muted);line-height:1.55}
.lbl{display:block;font-size:13px;color:var(--muted);margin:10px 0 6px}
.inp{width:100%;height:46px;border-radius:14px;border:1px solid var(--border);background:rgba(0,0,0,0.25);color:var(--text);padding:0 14px;font-size:15px;outline:none}
.inp:focus{border-color:rgba(124,92,255,0.6);box-shadow:0 0 0 4px rgba(124,92,255,0.18)}
.btn{width:100%;height:48px;margin-top:14px;border-radius:14px;border:1px solid var(--border);background:rgba(255,255,255,0.06);color:var(--text);font-weight:900;letter-spacing:0.3px;cursor:pointer}
.btn.primary{border-color:rgba(124,92,255,0.55);background:linear-gradient(180deg, rgba(124,92,255,0.95), rgba(124,92,255,0.70))}
.btn:disabled{opacity:0.6;cursor:not-allowed}
.status{min-height:22px;margin:12px 0 0;color:var(--muted)}
.status.ok{color:#7CFFB1}
.status.bad{color:#FF8A8A}
.row{display:flex;justify-content:center;margin-top:14px}
.link{color:rgba(232,238,252,0.85);text-decoration:none;font-weight:800;border-bottom:1px dashed rgba(232,238,252,0.35)}
.foot{margin-top:14px;color:rgba(232,238,252,0.55);font-size:12px;text-align:center;max-width:720px}