:root{color-scheme:light;--canvas:#f7faff;--surface:#ffffff;--glass:rgba(255,255,255,.85);--ink:#111b30;--muted:#718096;--line:#e2e8f0;--field:#f8faff;--accent:#2563eb;--cyan:#06b6d4;--shadow:0 28px 90px rgba(23,43,83,.1);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-synthesis:none}
html[data-theme=dark]{color-scheme:dark;--canvas:#030712;--surface:#080f1e;--glass:rgba(8,15,30,.82);--ink:#f8fafc;--muted:#94a3b8;--line:#1e293b;--field:#0d1729;--accent:#3b82f6;--cyan:#22d3ee;--shadow:0 28px 100px rgba(0,0,0,.36)}
*{box-sizing:border-box}body{margin:0;min-height:100vh;color:var(--ink);background:var(--canvas);-webkit-font-smoothing:antialiased;overflow-x:hidden}button,input{font:inherit}button{cursor:pointer}a{text-decoration:none;color:inherit}button:focus-visible,input:focus-visible{outline:3px solid #62b7fa;outline-offset:3px}
.login-grid{position:fixed;inset:0;pointer-events:none;opacity:.45;background-image:linear-gradient(to right,rgba(99,130,186,.07) 1px,transparent 1px),linear-gradient(to bottom,rgba(99,130,186,.07) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse at 45% 50%,#000,transparent 84%)}
.ambient{position:fixed;border-radius:50%;filter:blur(90px);pointer-events:none;opacity:.27;animation:ambientMove 15s ease-in-out infinite alternate}.ambient-one{width:440px;height:440px;background:#1557f0;left:-140px;top:-130px}.ambient-two{width:380px;height:380px;background:#04adcc;bottom:-190px;left:28%;animation-delay:-7s}.ambient-three{width:340px;height:340px;background:#554cf4;right:-140px;top:18%;animation-delay:-3s;opacity:.14}
@keyframes ambientMove{to{transform:translate(34px,28px) scale(1.15)}}
.login-shell{min-height:100vh;max-width:1550px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.06fr) minmax(400px,.94fr);position:relative;z-index:1}
.showcase{display:flex;flex-direction:column;min-height:100vh;padding:41px clamp(34px,5vw,86px) 30px;position:relative;overflow:hidden}
.showcase:after{content:"";position:absolute;inset:0 0 0 auto;width:1px;background:linear-gradient(transparent,var(--line) 30%,var(--line) 70%,transparent)}
.brand{display:inline-flex;align-items:center;gap:11px;align-self:flex-start;font-size:17px;font-weight:900;letter-spacing:.3px;position:relative;z-index:2}.brand img{width:42px;height:42px;filter:drop-shadow(0 5px 12px #1795ed50)}.brand b{color:var(--accent);font-size:11px;letter-spacing:3px;margin-left:4px}
.showcase-content{margin:auto 0;position:relative;z-index:1;padding:48px 0 20px}.top-label{display:inline-flex;gap:10px;align-items:center;border:1px solid #3b82f648;border-radius:40px;padding:10px 15px;font-size:10px;font-weight:800;letter-spacing:1.6px;color:var(--accent);background:#2879eb0d}.top-label i{width:7px;height:7px;border-radius:50%;background:#14cdb4;box-shadow:0 0 16px #14cdb4}
.showcase h1{font-size:clamp(36px,4.7vw,73px);line-height:1.09;letter-spacing:-2.9px;margin:27px 0 22px;font-weight:850;max-width:700px}.showcase h1 span{background:linear-gradient(90deg,#2563eb 0%,#05c9e8 52%,#818cf8 100%);background-clip:text;-webkit-background-clip:text;color:transparent}
.showcase p{color:var(--muted);line-height:1.8;font-size:15px;max-width:540px;margin:0}
.currency-scene{height:275px;margin-top:40px;position:relative;perspective:700px;max-width:640px}.scene-halo{position:absolute;border:1px solid #3483ec50;left:50%;top:48%;border-radius:50%;transform:translate(-50%,-50%) rotateX(52deg)}.halo-a{width:340px;height:300px;box-shadow:0 0 80px #126ee114 inset;animation:spin 25s linear infinite}.halo-b{width:520px;height:440px;border-style:dashed;opacity:.5;animation:spin 42s linear infinite reverse}@keyframes spin{to{transform:translate(-50%,-50%) rotateX(52deg) rotate(360deg)}}
.scene-core{position:absolute;left:50%;top:47%;width:108px;height:108px;transform:translate(-50%,-50%) rotate(-8deg);border:1px solid #4ea7ff66;border-radius:31px;display:grid;place-items:center;background:linear-gradient(145deg,#2368e3,#162e67 56%,#0f1d3f);box-shadow:0 20px 60px #2563eb5c,inset 0 1px 1px #ffffff55;animation:float 6s ease-in-out infinite}.scene-core img{width:65px;height:65px;object-fit:contain;filter:drop-shadow(0 0 13px #1cc8ff90)}.core-gloss{position:absolute;inset:0;background:linear-gradient(140deg,#ffffff23,transparent 45%);border-radius:inherit}@keyframes float{50%{transform:translate(-50%,-58%) rotate(2deg)}}
.float-chip{position:absolute;display:flex;align-items:center;gap:9px;border-radius:14px;border:1px solid var(--line);background:var(--glass);padding:12px 14px;box-shadow:0 15px 40px #03071224;backdrop-filter:blur(22px);animation:bob 7s ease-in-out infinite}.float-chip span{width:30px;height:30px;display:grid;place-items:center;border-radius:10px;background:#2563eb20;color:var(--accent);font-size:19px;font-weight:700}.float-chip b{font-size:12px;letter-spacing:.5px}.float-chip small{font-size:10px;color:var(--muted)}.chip-azn{left:6%;top:5%}.chip-try{right:3%;top:15%;animation-delay:-1.8s}.chip-usd{left:2%;bottom:10%;animation-delay:-4s}.chip-eur{right:9%;bottom:4%;animation-delay:-3s}@keyframes bob{50%{transform:translateY(-12px)}}
.showcase-bottom{display:flex;align-items:center;gap:9px;font-size:11px;color:var(--muted);position:relative;z-index:2}.showcase-bottom>span:last-child{margin-left:auto}.secure-dot{color:#10bca5;font-size:14px}
.login-side{min-height:100vh;padding:38px clamp(24px,4.9vw,80px) 29px;display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;position:relative}.login-top{align-self:flex-end;display:flex;align-items:center;gap:15px}.private-badge{font-size:10px;font-weight:850;letter-spacing:1.2px;color:var(--muted)}.private-badge span{color:#13bea4;margin-right:5px}.theme-toggle{width:43px;height:43px;border:1px solid var(--line);border-radius:13px;background:var(--surface);color:var(--ink);font-size:19px;box-shadow:0 6px 18px #050b2112}
.login-card{width:min(100%,475px);margin:auto;position:relative;padding:34px 0}.login-icon{width:58px;height:58px;border-radius:18px;background:linear-gradient(145deg,#155ae4,#062d6d);display:grid;place-items:center;box-shadow:0 14px 40px #2164ea45;border:1px solid #4597fd60;margin-bottom:31px}.login-icon img{width:43px;height:43px;object-fit:contain}.eyebrow{font-size:11px;font-weight:850;letter-spacing:2.4px;color:var(--accent)}.login-card h2{font-size:clamp(30px,3vw,42px);line-height:1.15;letter-spacing:-1.4px;margin:13px 0}.login-card h2>span:first-child{color:var(--accent)}.wave{font-size:24px;color:#04bbd3}.login-intro{color:var(--muted);font-size:14px;line-height:1.75;margin:0 0 34px;max-width:400px}
#login-form{display:flex;flex-direction:column}#login-form>label{font-size:12px;font-weight:760;margin-bottom:9px}.input-wrap{position:relative;display:flex;align-items:center;margin-bottom:23px}.input-icon{position:absolute;left:16px;color:#7c94b8;font-size:18px;z-index:2}.input-wrap input{width:100%;height:54px;border:1px solid var(--line);background:var(--field);color:var(--ink);border-radius:14px;padding:0 16px 0 45px;outline:none;transition:border-color .2s,box-shadow .2s;font-size:14px}.input-wrap input:focus{border-color:#4592ff;box-shadow:0 0 0 4px #3485f018}.input-wrap input::placeholder{color:#8092ad}.password-toggle{position:absolute;right:12px;border:0;background:transparent;color:var(--accent);font-size:11px;font-weight:750;padding:8px}.input-wrap:has(.password-toggle) input{padding-right:76px}
.remember-row{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:-2px 0 26px}.remember{display:flex;gap:9px;align-items:center;cursor:pointer;font-size:12px;font-weight:700;color:var(--ink)}.remember input{position:absolute;opacity:0;width:1px;height:1px}.custom-check{width:20px;height:20px;display:grid;place-items:center;border-radius:6px;border:1px solid #3b82f6;background:#2563eb;color:white;font-size:11px;transition:all .2s}.remember input:not(:checked)+.custom-check{background:transparent;color:transparent;border-color:var(--line)}.remember input:focus-visible+.custom-check{outline:3px solid #75b5fb;outline-offset:2px}.remember-hint{font-size:11px;color:var(--muted)}.login-error{margin:0 0 13px;background:#fb3b5c13;border:1px solid #f94f7a61;color:#f86d8d;border-radius:11px;font-size:12px;padding:11px 13px}.login-error[hidden]{display:none}
.login-submit{position:relative;display:flex;align-items:center;justify-content:center;gap:14px;border:0;width:100%;height:56px;border-radius:14px;color:#fff;font-weight:800;letter-spacing:.2px;font-size:14px;background:linear-gradient(115deg,#2563eb,#3179f3 60%,#12bfe0);box-shadow:0 15px 35px #296aeb44;transition:transform .2s,box-shadow .2s,filter .2s}.login-submit:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 20px 38px #296aeb50}.login-submit:disabled{opacity:.7;cursor:wait}.submit-arrow{font-size:20px}
.login-divider{height:1px;background:var(--line);margin:34px 0 22px;position:relative}.login-divider span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:0 13px;background:var(--canvas);font-size:10px;letter-spacing:2px;font-weight:750;color:var(--muted);white-space:nowrap}.trust-row{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:11px}.trust-row>span:first-child{color:#0ac7b2;font-size:15px}.trust-row>span:last-child{margin-left:auto;font-size:10px;color:var(--accent);font-weight:800}.login-foot{text-align:center;color:var(--muted);font-size:11px}.login-foot span{padding:0 7px;color:var(--accent)}
@media(max-width:1000px){.login-shell{grid-template-columns:.9fr 1.1fr}.showcase{padding:30px}.showcase h1{letter-spacing:-1.8px}.currency-scene{height:220px}.float-chip{padding:9px}.float-chip small{display:none}.scene-halo.halo-b{width:390px;height:330px}.showcase-bottom>span:last-child{display:none}}
@media(max-width:720px){.login-shell{display:block}.showcase{min-height:auto;padding:21px 23px 0;overflow:visible}.showcase:after{display:none}.showcase-content{display:none}.showcase-bottom{display:none}.brand img{width:34px;height:34px}.brand{font-size:15px}.login-side{min-height:calc(100dvh - 62px);padding:8px 24px 24px}.login-top{position:absolute;right:24px;top:-51px}.private-badge{display:none}.theme-toggle{width:40px;height:40px}.login-card{padding:28px 0 36px}.login-icon{margin-bottom:22px}.login-card h2{font-size:36px}.login-intro{margin-bottom:25px}.login-foot{padding:0 0 6px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important;transition:none!important}}
/* v0.3 account recovery */
.forgot-link{display:inline-block;margin:10px 0 4px;color:#4a99f3;font-size:12px;font-weight:750;text-decoration:none}
.forgot-link:hover{text-decoration:underline}
.recovery-details{margin:12px 0 22px;border:1px solid #2b4b72;border-radius:12px;padding:14px 16px;color:#aad0ff;font-size:12px}
.recovery-details summary{cursor:pointer;font-weight:750;line-height:1.6}
.recovery-details form{margin-top:15px}
#email-request-form,#email-finish-form{display:grid;gap:8px;margin-bottom:18px}
#email-request-form .login-submit,#email-finish-form .login-submit{margin-top:8px}
