*{box-sizing:border-box;margin:0;padding:0;font-family:'Segoe UI',Arial,sans-serif}
:root{--navy:#020b1f;--navy2:#061b3f;--blue:#0588ff;--cyan:#21d4ff;--text:#eef7ff;--muted:#93a9c8;--glass:rgba(4,18,43,.78);--line:rgba(75,151,255,.38)}
body{min-height:100vh;color:var(--text);display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(circle at 20% 50%,rgba(0,174,255,.28),transparent 26%),radial-gradient(circle at 80% 25%,rgba(10,93,255,.28),transparent 28%),linear-gradient(135deg,#010817 0%,#061a3d 48%,#020817 100%);overflow:hidden}
body:before{content:"";position:fixed;inset:0;background:linear-gradient(135deg,rgba(36,213,255,.08) 0 1px,transparent 1px 80px),linear-gradient(45deg,transparent 0 48%,rgba(0,137,255,.22) 49% 51%,transparent 52%);opacity:.45;pointer-events:none}
body:after{content:"";position:fixed;width:760px;height:760px;left:-360px;top:18%;border-radius:50%;border:18px solid rgba(20,190,255,.45);box-shadow:0 0 0 28px rgba(0,96,255,.16),0 0 80px rgba(0,167,255,.5);opacity:.75;pointer-events:none}
.shape{position:fixed;z-index:0;pointer-events:none}.s1{width:100%;height:170px;top:20px;left:0;background:linear-gradient(90deg,transparent 0 12%,rgba(0,119,255,.75) 12.2% 12.6%,transparent 12.8% 26%,rgba(0,167,255,.8) 26.2% 26.8%,transparent 27% 45%,rgba(0,119,255,.7) 45.2% 45.7%,transparent 46% 67%,rgba(0,167,255,.8) 67.2% 67.8%,transparent 68%),linear-gradient(22deg,transparent 0 18%,rgba(0,119,255,.6) 18.2% 18.6%,transparent 18.8% 34%,rgba(0,119,255,.65) 34.2% 34.7%,transparent 35% 60%,rgba(0,119,255,.65) 60.2% 60.7%,transparent 61%);opacity:.6}.s2{width:90%;height:90%;right:-25%;bottom:-25%;border-radius:50%;border:1px solid rgba(0,145,255,.18);box-shadow:inset 0 0 80px rgba(0,145,255,.12)}
.box{position:relative;z-index:2;width:100%;max-width:470px;padding:38px 28px 30px;border-radius:30px;background:linear-gradient(180deg,rgba(8,25,58,.88),rgba(3,13,31,.88));border:1px solid var(--line);box-shadow:0 24px 90px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(16px);overflow:hidden}
.box:before{content:"🔒";display:block;width:84px;height:84px;line-height:84px;margin:0 auto 18px;text-align:center;font-size:42px;border-radius:26px;background:linear-gradient(135deg,rgba(32,218,255,.22),rgba(0,92,255,.2));border:1px solid rgba(52,194,255,.45);box-shadow:0 0 34px rgba(0,140,255,.28)}
.brand{text-align:center;font-size:36px;line-height:1;font-weight:900;margin-bottom:12px;letter-spacing:-1px;color:#fff}.brand span{color:var(--blue);text-shadow:0 0 22px rgba(0,136,255,.55)}h2{text-align:center;font-size:24px;margin-bottom:8px;color:#fff}p{text-align:center;color:var(--muted);margin-bottom:28px;font-size:15px}.alert{background:rgba(255,59,92,.15);border:1px solid rgba(255,59,92,.35);color:#ffd6dd;padding:12px;border-radius:14px;text-align:center;margin-bottom:16px}form{display:grid;gap:15px}input{width:100%;height:58px;padding:0 18px;border-radius:15px;border:1px solid rgba(88,155,255,.32);background:rgba(4,16,40,.72);color:#fff;font-size:16px;outline:none;box-shadow:inset 0 0 20px rgba(0,0,0,.1)}input::placeholder{color:#8798b5}input:focus{border-color:var(--cyan);box-shadow:0 0 0 4px rgba(33,212,255,.08),0 0 28px rgba(0,136,255,.16)}button{width:100%;height:58px;margin-top:4px;border:0;border-radius:15px;background:linear-gradient(135deg,#0aa7ff,#0058ff);color:white;font-weight:900;font-size:17px;letter-spacing:.3px;box-shadow:0 16px 36px rgba(0,96,255,.35);cursor:pointer}button:hover{filter:brightness(1.08)}.link{margin-top:22px;text-align:center;color:var(--muted)}.link a,.back{color:#1fbfff;text-decoration:none;font-weight:800}.back{display:block;margin-top:16px;text-align:center}.link a:hover,.back:hover{text-decoration:underline}
@media(max-width:520px){body{padding:18px;align-items:center}.box{max-width:100%;padding:34px 22px 26px;border-radius:26px}.brand{font-size:34px}body:after{width:520px;height:520px;left:-310px;top:18%;border-width:12px}.s1{top:8px;height:130px}input,button{height:56px}}