:root{--navy:#06172f;--blue:#0a3472;--gold:#d9aa4a;--gold2:#f3d07a;--white:#fff;--muted:#cbd5e1;--glass:rgba(255,255,255,.12);--line:rgba(255,255,255,.18)}
.arm-auth-page{margin:0;min-height:100vh;font-family:Inter,Arial,sans-serif;color:var(--white);background:radial-gradient(circle at top left,#174b93 0,#07172f 38%,#030816 100%);overflow-x:hidden}.auth-bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}.orb{position:absolute;border-radius:50%;filter:blur(6px);opacity:.55;animation:floatOrb 8s ease-in-out infinite}.orb-1{width:340px;height:340px;background:linear-gradient(135deg,#d9aa4a,#fff0a6);top:-120px;right:8%;animation-delay:0s}.orb-2{width:260px;height:260px;background:linear-gradient(135deg,#0d5cb8,#00d4ff);bottom:-90px;left:5%;animation-delay:1.5s}.orb-3{width:160px;height:160px;background:linear-gradient(135deg,#fff,#d9aa4a);bottom:20%;right:18%;opacity:.25;animation-delay:3s}.grid-light{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent)}
.auth-shell{position:relative;z-index:1;min-height:100vh;width:min(1180px,92vw);margin:auto;display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:center;padding:42px 0}.auth-visual{min-height:610px;border:1px solid var(--line);border-radius:34px;padding:34px;background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.045));box-shadow:0 30px 90px rgba(0,0,0,.35);backdrop-filter:blur(18px);position:relative;overflow:hidden;animation:slideLeft .8s ease both}.auth-visual:after{content:"";position:absolute;width:450px;height:450px;border-radius:50%;border:1px solid rgba(255,255,255,.16);right:-160px;top:70px;box-shadow:inset 0 0 80px rgba(217,170,74,.2)}.auth-brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:#fff;position:relative;z-index:2}.brand-circle{width:62px;height:62px;border-radius:22px;display:grid;place-items:center;background:linear-gradient(135deg,var(--gold),var(--gold2));color:#07172f;font-weight:900;letter-spacing:-1px;box-shadow:0 14px 35px rgba(217,170,74,.3)}.auth-brand b{display:block;font-size:17px}.auth-brand small{display:block;color:var(--muted);margin-top:3px}.visual-copy{position:relative;z-index:2;margin-top:95px;max-width:650px}.auth-badge{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(243,208,122,.45);background:rgba(217,170,74,.12);color:#ffe6a3;border-radius:999px;padding:9px 14px;font-weight:800;font-size:13px;letter-spacing:.4px;text-transform:uppercase}.visual-copy h1{font-size:clamp(36px,5vw,64px);line-height:1.02;margin:22px 0 18px;letter-spacing:-2.5px}.visual-copy p{font-size:17px;line-height:1.8;color:#dbe7ff;max-width:590px}.feature-list{position:absolute;left:34px;right:34px;bottom:34px;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;z-index:2}.feature-list div{border:1px solid var(--line);border-radius:22px;padding:18px;background:rgba(255,255,255,.08);transition:.35s ease}.feature-list div:hover{transform:translateY(-6px);background:rgba(255,255,255,.14)}.feature-list span{width:38px;height:38px;border-radius:14px;display:grid;place-items:center;background:rgba(217,170,74,.16);color:#ffe8a6;margin-bottom:12px}.feature-list b{display:block;font-size:14px}.feature-list small{display:block;color:var(--muted);margin-top:5px;font-size:12px;line-height:1.45}.auth-panel{animation:slideRight .9s ease both}.auth-card{position:relative;border-radius:34px;padding:34px;background:rgba(255,255,255,.96);color:#07172f;box-shadow:0 34px 100px rgba(0,0,0,.42);overflow:hidden}.auth-card:before{content:"";position:absolute;inset:0 0 auto 0;height:7px;background:linear-gradient(90deg,var(--gold),var(--gold2),#fff1ad,var(--gold))}.card-head{display:flex;gap:16px;align-items:center;margin-bottom:26px}.mini-logo{width:58px;height:58px;display:grid;place-items:center;border-radius:20px;background:linear-gradient(135deg,#07172f,#123b79);box-shadow:0 15px 35px rgba(7,23,47,.2);font-size:24px}.card-head h2{margin:0;font-size:30px;letter-spacing:-1px;color:#07172f}.card-head p{margin:6px 0 0;color:#64748b;line-height:1.5}.auth-alert{border:1px solid #fecaca;background:#fff1f2;color:#9f1239;border-radius:18px;padding:13px 15px;margin-bottom:18px;font-weight:700;font-size:14px}.auth-field{display:block;margin:16px 0}.auth-field span{display:block;font-size:13px;font-weight:900;color:#334155;margin-bottom:8px;letter-spacing:.2px}.input-wrap{display:flex;align-items:center;gap:10px;border:1px solid #dce4ef;border-radius:18px;background:#f8fafc;padding:0 15px;transition:.25s ease}.input-wrap:focus-within{border-color:var(--gold);box-shadow:0 0 0 5px rgba(217,170,74,.14);background:#fff}.input-wrap i{font-style:normal;opacity:.8}.input-wrap input{width:100%;border:0;outline:0;background:transparent;padding:17px 0;font-size:15px;color:#0f172a}.auth-btn{margin-top:10px;width:100%;border:0;border-radius:18px;padding:17px 18px;display:flex;justify-content:center;align-items:center;gap:14px;background:linear-gradient(135deg,var(--gold),var(--gold2));color:#07172f;font-weight:950;font-size:16px;cursor:pointer;box-shadow:0 18px 36px rgba(217,170,74,.28);transition:.3s ease}.auth-btn:hover{transform:translateY(-3px);box-shadow:0 22px 44px rgba(217,170,74,.38)}.auth-btn b{font-size:20px;transition:.3s ease}.auth-btn:hover b{transform:translateX(5px)}.auth-foot{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:20px;flex-wrap:wrap}.auth-foot a{color:#0b3a78;text-decoration:none;font-weight:900}.auth-foot small{color:#64748b;font-weight:700}.stokis-auth{background:radial-gradient(circle at top left,#0d4c52 0,#07172f 42%,#050812 100%)}.stokis-auth .brand-circle,.stokis-auth .auth-btn{background:linear-gradient(135deg,#c9972c,#ffe08a)}
@keyframes floatOrb{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(16px,-18px,0) scale(1.04)}}@keyframes slideLeft{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:translateX(0)}}@keyframes slideRight{from{opacity:0;transform:translateX(28px) scale(.98)}to{opacity:1;transform:translateX(0) scale(1)}}
@media(max-width:900px){.auth-shell{grid-template-columns:1fr;padding:24px 0;gap:18px}.auth-visual{min-height:auto;padding:24px;border-radius:28px}.visual-copy{margin-top:38px}.feature-list{position:relative;left:auto;right:auto;bottom:auto;margin-top:28px;grid-template-columns:1fr}.auth-card{border-radius:28px;padding:26px}.auth-panel{order:2}.auth-visual{order:1}.visual-copy h1{letter-spacing:-1.5px}.auth-foot{display:block}.auth-foot small{display:block;margin-top:10px}.orb-1{right:-120px}.orb-2{left:-120px}}@media(max-width:520px){.auth-shell{width:min(94vw,460px)}.auth-visual{padding:20px}.auth-brand b{font-size:14px}.brand-circle{width:52px;height:52px;border-radius:18px}.visual-copy h1{font-size:32px}.visual-copy p{font-size:15px}.card-head h2{font-size:26px}.card-head{align-items:flex-start}.mini-logo{width:52px;height:52px;border-radius:18px}.auth-card{padding:22px}.input-wrap input{font-size:14px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}


/* FIX OVERLAP */
.auth-card,.auth-visual{height:auto!important}
.card-head h2,.visual-copy h1,.visual-copy p,.auth-brand b,.auth-brand small{word-break:break-word}
.auth-foot{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:15px}
.auth-btn{width:100%;padding:18px;border:none;border-radius:18px}
@media(max-width:991px){
 .auth-shell{grid-template-columns:1fr!important;padding:20px 0!important}
 .auth-visual{min-height:auto!important;padding:24px!important}
 .visual-copy{margin-top:30px!important}
 .visual-copy h1{font-size:32px!important;line-height:1.2!important;letter-spacing:-1px!important}
 .visual-copy p{font-size:15px!important;line-height:1.7!important}
 .feature-list{position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;margin-top:25px;grid-template-columns:1fr!important}
 .auth-panel{width:100%}
 .auth-card{padding:24px!important}
 .card-head{align-items:flex-start}
 .card-head h2{font-size:24px!important}
}