:root{--auth-navy:#0d1c34;--auth-blue:#2563eb;--auth-cyan:#36bffa;--auth-text:#13213a;--auth-muted:#68758a;--auth-line:#dce4ef}
*{box-sizing:border-box}.auth-body{min-height:100vh;margin:0;overflow-x:hidden;color:var(--auth-text);background:#eef3f9;font-family:Inter,"Segoe UI",Arial,sans-serif}.auth-shell{display:grid;width:100%;min-height:100vh;grid-template-columns:minmax(470px,1.12fr) minmax(440px,.88fr)}
.auth-showcase{position:relative;display:flex;min-height:100vh;overflow:hidden;padding:34px clamp(34px,5vw,76px) 25px;flex-direction:column;color:#fff;background:linear-gradient(145deg,#0a172b 0%,#112b4f 55%,#164e86 100%);isolation:isolate}.auth-showcase:before{position:absolute;z-index:-1;inset:0;content:"";opacity:.35;background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px);background-size:54px 54px;mask-image:linear-gradient(to bottom,transparent,#000 36%,transparent)}.auth-glow{position:absolute;z-index:-1;border-radius:50%;filter:blur(8px)}.auth-glow-one{top:-180px;right:-120px;width:430px;height:430px;background:#2563eb50}.auth-glow-two{bottom:-200px;left:-130px;width:440px;height:440px;background:#06b6d43d}
.auth-brand{display:flex;align-items:center;gap:13px}.auth-brand-logos{display:flex;padding:5px;background:#fff;border:1px solid #ffffff50;border-radius:13px;box-shadow:0 12px 25px #02061744}.auth-brand-logos span{display:grid;width:42px;height:32px;place-items:center;overflow:hidden}.auth-brand-logos img{max-width:100%;max-height:100%;object-fit:contain}.auth-brand strong,.auth-brand small{display:block}.auth-brand strong{font-size:19px}.auth-brand small{margin-top:3px;color:#a9c5e7;font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.auth-message{position:relative;z-index:2;margin-top:clamp(40px,8vh,82px);max-width:570px}.auth-eyebrow{display:inline-flex;align-items:center;gap:8px;color:#a9c7ed;font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.auth-eyebrow i{width:8px;height:8px;background:#38bdf8;border-radius:50%;box-shadow:0 0 0 5px #38bdf821}.auth-message h1{margin:15px 0 13px;font-size:clamp(38px,5vw,65px);line-height:.98;letter-spacing:-.045em}.auth-message h1 em{color:#65c8ff;font-style:normal}.auth-message p{max-width:500px;margin:0;color:#bfd1e7;font-size:clamp(13px,1.25vw,16px);line-height:1.6}
.auth-scene{position:relative;width:min(590px,100%);height:245px;margin:auto auto 4px}.scene-dashboard{position:absolute;right:4%;bottom:30px;width:74%;height:180px;overflow:hidden;background:#f8fbff;border:1px solid #ffffff7d;border-radius:17px;box-shadow:0 30px 55px #02061755;transform:perspective(800px) rotateY(-7deg);animation:sceneFloat 5s ease-in-out infinite}.scene-window-bar{display:flex;height:25px;align-items:center;gap:5px;padding:0 11px;background:#e9eff7}.scene-window-bar i{width:6px;height:6px;background:#f87171;border-radius:50%}.scene-window-bar i:nth-child(2){background:#fbbf24}.scene-window-bar i:nth-child(3){background:#34d399}.scene-window-body{display:grid;height:155px;grid-template-columns:48px 1fr}.scene-side{display:flex;padding:12px 9px;gap:8px;flex-direction:column;background:#17243a}.scene-side b{height:6px;background:#ffffff38;border-radius:5px}.scene-side b:first-child{height:22px;background:#3b82f6}.scene-content{padding:14px}.scene-content>span{display:block;width:42%;height:9px;background:#cbd8e8;border-radius:7px}.scene-content>div{display:grid;margin-top:12px;grid-template-columns:repeat(3,1fr);gap:8px}.scene-content>div b{height:48px;background:linear-gradient(145deg,#dbeafe,#bfdbfe);border-radius:8px}.scene-content>i{display:block;height:8px;margin-top:10px;background:#e5ebf3;border-radius:6px}.scene-content>i:last-child{width:70%}.scene-person{position:absolute;z-index:4;bottom:22px;left:4%;font-size:67px;filter:drop-shadow(0 15px 10px #02061755);animation:personWalk 4.2s ease-in-out infinite}.scene-package{position:absolute;z-index:3;bottom:29px;left:19%;font-size:38px;filter:drop-shadow(0 10px 8px #02061740);animation:packageBounce 4.2s ease-in-out infinite}.scene-floor{position:absolute;right:0;bottom:19px;width:96%;height:2px;background:linear-gradient(90deg,transparent,#9cccf2 25%,#9cccf2 80%,transparent)}.scene-orbit{position:absolute;z-index:5;display:grid;width:42px;height:42px;place-items:center;background:#ffffffed;border:1px solid #fff;border-radius:13px;box-shadow:0 12px 22px #0206173d;font-size:20px;animation:iconFloat 3s ease-in-out infinite}.orbit-one{top:4px;right:4%}.orbit-two{top:63px;left:11%;animation-delay:-1s}.orbit-three{right:0;bottom:24px;animation-delay:-2s}
.auth-showcase-footer{display:flex;position:relative;z-index:3;justify-content:space-between;color:#8fabcd;font-size:9px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.auth-access{display:flex;min-height:100vh;align-items:center;justify-content:center;padding:32px clamp(28px,5vw,72px);flex-direction:column;background:radial-gradient(circle at 75% 18%,#dce9ff 0,transparent 32%),#f5f7fb}.auth-card{width:100%;max-width:455px;padding:clamp(30px,4vw,46px);background:#ffffffee;border:1px solid #fff;border-radius:24px;box-shadow:0 28px 70px #17325c1a;animation:cardEnter .65s cubic-bezier(.2,.75,.25,1) both}.auth-mobile-brand{display:none}.auth-kicker{color:var(--auth-blue);font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.auth-card h2{margin:8px 0 5px;font-size:34px;letter-spacing:-.035em}.auth-subtitle{margin:0 0 26px;color:var(--auth-muted);font-size:13px;line-height:1.5}.auth-error{display:flex;align-items:center;gap:9px;margin:-7px 0 17px;padding:10px 12px;color:#991b1b;background:#fff1f2;border:1px solid #fecdd3;border-radius:10px;font-size:11px;font-weight:700}.auth-error span{display:grid;width:20px;height:20px;place-items:center;color:#fff;background:#ef4444;border-radius:6px}.auth-card.has-error{animation:cardEnter .55s ease both,cardShake .34s .6s ease both}.auth-form{display:grid;gap:18px}.auth-field label{display:block;margin-bottom:7px;color:#26344b;font-size:11px;font-weight:800}.auth-input-wrap{position:relative}.auth-input-wrap input{width:100%;height:51px;padding:0 46px;color:var(--auth-text);background:#f8fafc;border:1px solid var(--auth-line);border-radius:12px;outline:0;font:inherit;font-size:13px;transition:border-color .18s,box-shadow .18s,background .18s}.auth-input-wrap input::placeholder{color:#9aa6b7}.auth-input-wrap input:focus{background:#fff;border-color:#7aa5f8;box-shadow:0 0 0 4px #2563eb13}.auth-input-icon{position:absolute;z-index:2;top:50%;left:15px;font-size:15px;transform:translateY(-50%);filter:grayscale(1)}.auth-password-toggle{position:absolute;top:50%;right:8px;width:36px;height:36px;padding:0;background:transparent;border:0;border-radius:9px;cursor:pointer;filter:grayscale(1);transform:translateY(-50%)}.auth-password-toggle:hover,.auth-password-toggle:focus-visible{background:#e9eef6;outline:0}.auth-submit{display:flex;width:100%;height:52px;align-items:center;justify-content:space-between;margin-top:3px;padding:0 17px 0 21px;color:#fff;background:linear-gradient(110deg,#2359d7,#2878ed);border:0;border-radius:12px;box-shadow:0 12px 24px #2563eb38;cursor:pointer;font-size:12px;font-weight:900;transition:transform .18s,box-shadow .18s}.auth-submit:hover{transform:translateY(-2px);box-shadow:0 16px 28px #2563eb42}.auth-submit b{display:grid;width:28px;height:28px;place-items:center;background:#ffffff1d;border-radius:8px;font-size:17px}.auth-submit.is-loading{cursor:wait;opacity:.85}.auth-submit.is-loading b{font-size:0}.auth-submit.is-loading b:after{width:13px;height:13px;content:"";border:2px solid #ffffff66;border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}.auth-security{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:22px;color:#8a96a8;font-size:9.5px}.auth-security span{color:#22c55e;font-size:12px}.auth-credit{margin:18px 0 0;color:#8a96a8;font-size:9.5px}.auth-credit strong{color:#64748b}
.auth-developer-card{display:flex;position:relative;z-index:3;max-width:570px;align-items:center;gap:12px;margin:2px 0 14px;padding:10px 13px;background:#ffffff0c;border:1px solid #ffffff17;border-radius:13px;backdrop-filter:blur(8px)}.auth-developer-card img{width:42px;height:42px;padding:3px;object-fit:contain;background:#fff;border-radius:10px}.auth-developer-card div{min-width:0}.auth-developer-card small,.auth-developer-card strong,.auth-developer-card span{display:block}.auth-developer-card small{color:#83b7e5;font-size:8px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.auth-developer-card strong{margin-top:2px;font-size:13px}.auth-developer-card span{margin-top:3px;overflow:hidden;color:#a9bed9;font-size:8.5px;text-overflow:ellipsis;white-space:nowrap}.auth-showcase-footer{font-size:8px}.auth-credit{display:flex;align-items:center;gap:8px;margin-top:16px;text-align:left}.auth-credit img{width:27px;height:27px;padding:2px;object-fit:contain;background:#fff;border:1px solid #e1e7ef;border-radius:7px}.auth-credit span,.auth-credit small{display:block}.auth-credit strong{color:#4c5b70}.auth-credit small{margin-top:2px;color:#9aa5b5;font-size:7.5px}
@keyframes cardEnter{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}@keyframes cardShake{0%,100%{transform:translateX(0)}30%{transform:translateX(-7px)}65%{transform:translateX(6px)}}@keyframes sceneFloat{0%,100%{transform:perspective(800px) rotateY(-7deg) translateY(0)}50%{transform:perspective(800px) rotateY(-7deg) translateY(-7px)}}@keyframes personWalk{0%,100%{transform:translateX(0) rotate(-2deg)}50%{transform:translateX(16px) rotate(2deg)}}@keyframes packageBounce{0%,100%{transform:translate(0,0)}50%{transform:translate(13px,-4px)}}@keyframes iconFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-8px) rotate(4deg)}}@keyframes spin{to{transform:rotate(360deg)}}
@media(min-width:781px){.auth-body{overflow:hidden}}
@media(max-width:980px){.auth-shell{grid-template-columns:minmax(370px,.9fr) minmax(420px,1.1fr)}.auth-showcase{padding:30px}.auth-message h1{font-size:43px}.auth-scene{height:220px}.scene-dashboard{width:82%}}
@media(max-width:780px){.auth-shell{display:block}.auth-showcase{display:none}.auth-access{padding:24px;min-height:100vh}.auth-card{max-width:460px}.auth-mobile-brand{display:flex;height:42px;align-items:center;gap:12px;margin-bottom:24px}.auth-mobile-brand img{max-width:116px;max-height:38px;object-fit:contain}}
@media(max-width:460px){.auth-access{padding:16px}.auth-card{padding:27px 22px;border-radius:19px}.auth-card h2{font-size:30px}}
@media(prefers-reduced-motion:reduce){.auth-card,.scene-dashboard,.scene-person,.scene-package,.scene-orbit,.auth-submit{animation:none!important;transition:none!important}}