:root{color-scheme:dark;--cyan:#10d8ec;--blue:#2374ff;--violet:#792cff;--muted:#9ba7bf}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#02050c;color:#f5f7ff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
button,input{font:inherit}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
.shell{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(590px,.98fr);overflow:hidden;background:radial-gradient(circle at 73% 42%,#0b1323 0,#030710 48%,#01040a 100%)}
.art{position:relative;min-height:100vh;overflow:hidden;isolation:isolate;background:radial-gradient(circle at 28% 48%,#11245b91,transparent 36%),linear-gradient(117deg,#080a20,#020611 71%,#01040a)}
.art:after{content:"";position:absolute;inset:0;z-index:-2;opacity:.25;background-image:linear-gradient(#4670c510 1px,transparent 1px),linear-gradient(90deg,#4670c510 1px,transparent 1px);background-size:52px 52px;mask-image:radial-gradient(circle at 38% 48%,#000,transparent 72%)}
.aurora{position:absolute;left:-12%;top:7%;width:85%;height:86%;border-radius:50%;background:conic-gradient(from 205deg,#09d9ef1c,#793aff22,#1a44ff16,#09d9ef1c);filter:blur(45px)}
.art:before{content:"";position:absolute;z-index:2;width:min(38vw,570px);aspect-ratio:350/387;left:4.5vw;top:50%;transform:translateY(-50%);background:url("assets/identa-mark.png") center/contain no-repeat;filter:drop-shadow(0 0 5px #2877ffcc) drop-shadow(0 0 18px #09d8ec52)}
.vault{display:none}
.orbit{position:absolute;z-index:1;left:-7vw;top:50%;aspect-ratio:1;border:1px solid #5d6cff42;border-radius:50%;transform:translateY(-50%) rotate(-14deg)}
.orbit:before{content:"";position:absolute;inset:8%;border:1px solid #10d9eb30;border-radius:50%}
.orbit i{position:absolute;width:7px;height:7px;border-radius:50%;background:#57e9ff;box-shadow:0 0 14px 5px #2b7eff;right:9%;top:27%}
.o1{width:65vw}
.o2{width:53vw;left:-1vw;transform:translateY(-50%) rotate(31deg);border-color:#8548ff4a}
.o2 i{right:7%;top:62%}
.o3{width:43vw;left:4vw;transform:translateY(-50%) rotate(78deg);border-color:#14dce448}
.o3 i{right:12%;top:19%}
.prism{position:absolute;z-index:3;width:88px;height:88px;transform:rotate(45deg);border:1px solid #1bdcf078;filter:drop-shadow(0 0 12px #1376ff)}
.prism:before,.prism:after{content:"";position:absolute;inset:20%;border:1px solid #8051ff78}
.prism:after{inset:42%;background:#43e5ff;box-shadow:0 0 22px #5537ff}
.p1{right:16%;top:20%}
.p2{right:11%;bottom:16%;width:38px;height:38px;opacity:.65}
.caption{position:absolute;z-index:4;left:5.5vw;bottom:5vh;color:#aab6cc;font-size:14px;line-height:1.65}
.caption b{display:block;color:#54ddf1;font-size:10px;letter-spacing:.28em}
.zone{min-height:100vh;display:grid;place-items:center;padding:46px clamp(38px,5vw,96px);position:relative}
.zone:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0d162b16,#040810d9);pointer-events:none}
.card{position:relative;width:min(100%,590px);padding:46px 55px 40px;border:1px solid #667a9e5e;border-radius:24px;background:linear-gradient(145deg,#0e1829e8,#050b15f2);box-shadow:0 38px 110px #000a,inset 0 1px #ffffff0c;backdrop-filter:blur(24px)}
.brand{display:block;width:255px;max-width:72%;aspect-ratio:1176/387;background:url("assets/identa-logo.png") left center/contain no-repeat}
.brand svg,.brand>span{display:none}
.intro{margin:34px 0 30px}
.intro small{display:block;color:#4adff0;font-size:11px;font-weight:800;letter-spacing:.24em;margin-bottom:10px}
.intro h1{font-size:34px;line-height:1.16;letter-spacing:-.038em;margin:0 0 10px}
.intro p{margin:0;color:var(--muted);font-size:16px}
.intro p b{color:#d5dbea}
label{display:block;color:#dbe1ec;font-size:14px;font-weight:650;margin-bottom:10px}
input{width:100%;height:60px;border:1px solid #35425a;border-radius:11px;background:#030811ad;color:#f6f8ff;padding:0 18px;font-size:15px;transition:.2s}
input::placeholder{color:#738097}
input:hover{border-color:#4a5b77}
input:focus{outline:none;border-color:#2c9fff;box-shadow:0 0 0 3px #1b89ff24,0 0 28px #1688ff13}
input.invalid{border-color:#ff6585}
.pw{position:relative}
.pw input{padding-right:68px}
.pw button{position:absolute;right:11px;top:50%;transform:translateY(-50%);border:0;background:none;color:#55dbea;font-size:12px;cursor:pointer}
.account{width:100%;border:1px solid #2b3950;background:#080f1cb3;border-radius:10px;color:#aeb8ca;display:flex;align-items:center;gap:10px;padding:10px 11px;margin-bottom:19px;font-size:13px;cursor:pointer}
.account span{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--cyan),var(--violet));color:#fff}
.account i{font-style:normal}
.account b{margin-left:auto;color:#55dbea}
.link{border:0;background:none;color:#59d9ec;font-size:12px;padding:11px 0 0;cursor:pointer}
#message{min-height:34px;margin:0;padding-top:10px;color:#5fdcec;font-size:12px}
#message.error{color:#ff8198}
.continue{width:100%;height:60px;border:0;border-radius:11px;color:#fff;font-size:15px;font-weight:720;display:flex;justify-content:center;align-items:center;gap:15px;cursor:pointer;background:linear-gradient(100deg,var(--cyan),var(--blue) 53%,var(--violet));box-shadow:0 12px 32px #1955ff40;transition:.18s}
.continue:hover{filter:brightness(1.13);transform:translateY(-1px)}
.divider{display:flex;align-items:center;gap:15px;color:#758197;font-size:10px;text-transform:uppercase;letter-spacing:.13em;margin:28px 0 17px}
.divider:before,.divider:after{content:"";height:1px;flex:1;background:#2c3a50}
.divider span{white-space:nowrap}
.methods{display:grid;gap:12px}
.methods button{min-height:69px;display:grid;grid-template-columns:35px 1fr 18px;align-items:center;gap:12px;text-align:left;border:1px solid #34435b;border-radius:11px;background:#050a146b;color:#e7ebf4;padding:10px 16px;cursor:pointer;transition:.18s}
.methods button:hover{border-color:#3979c7;background:#17315742;transform:translateY(-1px)}
.methods strong{font-size:28px;color:#39cce9}
.methods span{display:grid;gap:3px}
.methods span b{font-size:14px}
.methods small{color:#8692a8;font-size:11px}
.methods em{font-style:normal;color:#65738b}
footer{text-align:center;margin-top:29px;color:#8190a7;font-size:12px}
footer nav{margin-top:12px;display:flex;justify-content:center;gap:12px}
footer a{color:#8d9ab0;text-decoration:none}
footer a:hover{color:#55dced}
@media(max-width:980px){.shell{display:block}
.art{position:fixed;inset:0;opacity:.55}
.art:before{width:68vw;left:-25vw}
.orbit{left:-58vw;width:140vw}
.o2{left:-46vw;width:115vw}
.o3{left:-35vw;width:92vw}
.caption{display:none}
.zone{padding:32px 20px}
.card{margin-left:auto;margin-right:auto}
}
@media(max-width:560px){.zone{align-items:start;padding:14px 10px}
.card{padding:30px 24px 25px;border-radius:18px}
.brand{width:220px}
.intro{margin:26px 0}
.intro h1{font-size:28px}
.divider span{font-size:9px}
.methods button{min-height:64px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important}
}