@font-face{font-family:Evantic;src:url("public/fonts/Evantic-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Space;src:url('public/fonts/SpaceGrotesk.ttf') format('truetype');font-display:swap}*{box-sizing:border-box}body{margin:0;background:#717587;font-family:-apple-system,BlinkMacSystemFont,'Helvetica Neue',sans-serif;color:#233955;min-height:100svh;display:grid;place-items:center;padding:24px}button,input,a{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #365a90;outline-offset:4px}::selection{background:#bdd4f4;color:#233955}.login-shell{position:relative;isolation:isolate;width:min(100%,420px);min-height:790px;overflow:hidden;border-radius:40px;background:#b5cce8;box-shadow:18px 30px 65px #252e4940}video,.wash{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.wash{z-index:-1;background:linear-gradient(180deg,#24457755 0%,#b2cae20a 30%,#e4eff830 65%,#e9f1fa66)}.brand{position:absolute;top:57px;left:0;width:100%;display:flex;align-items:center;flex-direction:column;gap:14px;transition:transform 1.15s cubic-bezier(.16,1,.3,1)}.brand img{width:120px;height:86px;object-fit:contain;filter:brightness(0) invert(1)}.brand span{font-family:Evantic,serif;font-size:34px;font-weight:400;letter-spacing:0;color:#f4f2ff;text-shadow:0 0 12px #ffffff55,0 0 28px #d9eaff40}.login-content{padding:245px 35px 34px}.login-content header{margin-bottom:30px}h1{font-family:Space,sans-serif;font-size:36px;font-weight:500;letter-spacing:-.035em;margin:0 0 9px}header p{font-size:14px;margin:0;color:#3d5675}label{display:block;font-size:12px;font-weight:600;margin:18px 0 9px}input{width:100%;height:53px;padding:0 16px;border:0;border-radius:15px;background:#f5faff80;box-shadow:inset 3px 4px 9px #54749a20,inset -2px -2px 6px #ffffff80;color:#233955;font:inherit;font-size:16px;caret-color:#365a90}input::placeholder{color:#566b85}.password-field{position:relative}.password-field input{padding-right:66px}.password-field button{position:absolute;right:5px;top:5px;height:43px;border:0;background:none;color:#354e71;font-size:12px;padding:0 13px}.help{display:block;margin:8px 0 0 auto;min-height:36px;font-size:12px;border:0;background:none;color:#354e71}.submit{display:flex;align-items:center;justify-content:space-between;width:100%;height:55px;border:0;border-radius:16px;background:#334d73;color:white;padding:0 20px;box-shadow:5px 8px 17px #45628a33,inset 0 1px 1px #ffffff30;transition:transform .2s,background .2s}.submit:hover{background:#284266}.submit:active{transform:scale(.98)}.submit:disabled{opacity:.6;cursor:wait}#message{font-size:12px;line-height:1.5;margin:0 0 12px}#message:empty{display:none}.demo{text-align:center;margin-top:24px}.demo button{border:0;background:none;color:#2d496f;font-size:13px;font-weight:600;min-height:44px}.demo p{font-size:11px;line-height:1.6;color:#455f7e;margin:4px 0 18px}.workspaces{display:block;text-align:center;font-size:12px;color:#354e71;text-underline-offset:4px}.skip{position:absolute;top:22px;right:22px;border:0;background:#eaf3ffb0;border-radius:20px;padding:10px 15px;color:#29446b;z-index:3}.intro .brand{transform:translateY(240px) scale(1.3)}.intro .login-content{visibility:hidden}.revealing .login-content>*{animation:arrive .9s cubic-bezier(.16,1,.3,1) both}.revealing .login-content form{animation-delay:.1s}.revealing .demo{animation-delay:.2s}.revealing .workspaces{animation-delay:.3s}@keyframes arrive{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}.leaving{opacity:0;transform:scale(.985);transition:opacity .35s,transform .35s}.no-script{padding:20px;font-size:12px}@media(max-width:540px){body{padding:0;background:#b5cce8}.login-shell{width:100%;min-height:100svh;border-radius:0;box-shadow:none}.login-content{padding-top:clamp(205px,29svh,265px);padding-bottom:max(30px,env(safe-area-inset-bottom))}.brand{top:max(40px,env(safe-area-inset-top))}.intro .brand{transform:translateY(25svh) scale(1.3)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.intro .brand{transform:none}.intro .login-content{visibility:visible}}

.brand .brand-dot{font-family:Arial,sans-serif;font-size:.65em;vertical-align:.08em}

/* Staged brand reveal: logo, wordmark, then the shared upward movement. */
.brand>img,.brand>span{opacity:1;transform:none;transition:opacity .65s ease,transform .8s cubic-bezier(.16,1,.3,1)}
.intro:not(.logo-visible) .brand>img{opacity:0;transform:translateY(14px)}
.intro:not(.wordmark-visible) .brand>span{opacity:0;transform:translateY(12px)}
.revealing .login-content>header{animation-delay:.6s}
.revealing .login-content>form{animation-delay:.7s}
.revealing .login-content>.demo{animation-delay:.8s}
.revealing .login-content>.workspaces{animation-delay:.9s}

.reset-intro .brand,.reset-intro .brand>*{transition:none!important}

.reset-animation{display:block;margin:8px auto 0;min-height:44px;padding:10px 16px;border:0;background:none;color:#455f7e;font:inherit;font-size:10px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}

/* Desktop and iPad workspace entry: brand stage left, readable form right. */
@media(min-width:701px){
 body.workspace-login{padding:32px;min-height:100dvh;background:#717587}
 .workspace-login .login-shell{width:min(1120px,100%);min-height:760px;border-radius:32px;display:grid;grid-template-columns:1fr 1fr;align-items:center}
 .workspace-login video{object-fit:cover;object-position:center 68%}
 .workspace-login .wash{background:linear-gradient(90deg,#415d8640,#dae7f2b8 58%,#e5eef7e0)}
 .workspace-login .brand{left:0;top:calc(50% - 110px);width:50%;gap:22px}
 .workspace-login .brand img{width:180px;height:130px}
 .workspace-login .brand>span{font-size:44px}
 .workspace-login .login-content{grid-column:2;width:100%;max-width:440px;padding:56px 38px;margin:0 auto}
 .workspace-login.intro .brand{transform:none}
 .workspace-login .intro .brand{transform:translateX(50%) translateY(40px) scale(1.1)}
 .workspace-login .brand{transition:transform 1.15s cubic-bezier(.16,1,.3,1)}
 .workspace-login .login-content h1{font-size:38px}
}
@media(min-width:701px) and (max-width:950px){
 body.workspace-login{padding:20px}
 .workspace-login .login-shell{grid-template-columns:40% 60%;min-height:min(820px,calc(100dvh - 40px))}
 .workspace-login .brand{width:40%}
 .workspace-login .brand img{width:145px;height:105px}
 .workspace-login .brand>span{font-size:34px}
 .workspace-login .intro .brand{transform:translateX(75%) translateY(30px)}
 .workspace-login .login-content{padding:48px 26px}
}
@media(min-width:701px) and (max-height:700px){.workspace-login .login-shell{min-height:680px}}
