:root{
  --pa-bg:#edf4ff;
  --pa-bg2:#f9fbff;
  --pa-card:#ffffff;
  --pa-soft:#f5f8ff;
  --pa-line:#d8e3f1;
  --pa-text:#091a3d;
  --pa-muted:#71809a;
  --pa-primary:#286cff;
  --pa-primary2:#568cff;
  --pa-green:#18b36b;
  --pa-purple:#7357ff;
  --pa-navy:#031525;
  --pa-shadow:0 28px 70px rgba(15,23,42,.14);
}

html[data-bs-theme="dark"]{
  --pa-bg:#03111e;
  --pa-bg2:#061728;
  --pa-card:#071a2c;
  --pa-soft:#0a2035;
  --pa-line:#1b3b54;
  --pa-text:#f7fbff;
  --pa-muted:#91abc1;
  --pa-shadow:0 30px 80px rgba(0,0,0,.36);
}

html.pa-lock,
html.pa-lock body{
  width:100%!important;
  height:100%!important;
  margin:0!important;
  overflow:hidden!important;
}

body.pa-auth{
  min-height:100vh!important;
  min-height:100dvh!important;
  margin:0!important;
  color:var(--pa-text)!important;
  background:
    radial-gradient(circle at 8% 12%,rgba(40,108,255,.10),transparent 24%),
    radial-gradient(circle at 92% 80%,rgba(115,87,255,.08),transparent 20%),
    linear-gradient(135deg,var(--pa-bg),var(--pa-bg2))!important;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}

.pa-old-hidden{display:none!important}

.pa-stage{
  position:relative;
  min-height:100vh;
  min-height:100dvh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px;
  overflow:hidden;
}

.pa-ambient{
  position:absolute;
  border-radius:999px;
  pointer-events:none;
  opacity:.45;
  animation:pa-float 8s ease-in-out infinite;
}
.pa-ambient.a{width:230px;height:230px;left:-85px;top:8%;background:rgba(40,108,255,.10)}
.pa-ambient.b{width:180px;height:180px;right:5%;bottom:2%;background:rgba(115,87,255,.09);animation-delay:-2s}
.pa-ambient.c{width:90px;height:90px;right:31%;top:6%;background:rgba(24,179,107,.07);animation-delay:-4s}

@keyframes pa-float{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-14px,0)}}
@keyframes pa-in{from{opacity:0;transform:translateY(14px) scale(.992)}to{opacity:1;transform:none}}
@keyframes pa-poster{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes pa-shine{0%{transform:translateX(-150%) skewX(-20deg)}60%,100%{transform:translateX(260%) skewX(-20deg)}}
@keyframes pa-key{0%,100%{transform:rotate(-5deg) scale(1)}50%{transform:rotate(5deg) scale(1.05)}}

.pa-shell{
  position:relative;
  z-index:2;
  width:min(1360px,100%);
  height:min(760px,calc(100dvh - 28px));
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--pa-line) 92%,transparent);
  border-radius:30px;
  background:var(--pa-card);
  box-shadow:var(--pa-shadow);
  animation:pa-in .4s ease-out;
}

.pa-visual,
.pa-login-pane,
.pa-signup-pane{
  position:absolute;
  top:0;
  width:50%;
  height:100%;
  transition:
    transform .72s cubic-bezier(.68,-.08,.18,1.06),
    opacity .38s ease;
  will-change:transform,opacity;
}

.pa-visual{
  left:0;
  z-index:3;
  padding:34px 36px 28px;
  display:flex;
  flex-direction:column;
  background:
    radial-gradient(circle at 78% 18%,rgba(40,108,255,.09),transparent 20%),
    linear-gradient(145deg,#f8fbff,#edf4ff 64%,#f8fbff);
}
html[data-bs-theme="dark"] .pa-visual{
  background:
    radial-gradient(circle at 78% 18%,rgba(40,108,255,.15),transparent 22%),
    linear-gradient(145deg,#061728,#082037 66%,#061728);
}

.pa-login-pane{
  right:0;
  z-index:2;
  padding:30px 36px 26px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--pa-card);
}

.pa-signup-pane{
  left:0;
  z-index:1;
  padding:0;
  opacity:0;
  transform:translateX(-105%);
  background:var(--pa-card);
}

.pa-shell.is-signup .pa-visual{
  transform:translateX(100%);
}
.pa-shell.is-signup .pa-login-pane{
  transform:translateX(105%);
  opacity:0;
  pointer-events:none;
}
.pa-shell.is-signup .pa-signup-pane{
  z-index:4;
  opacity:1;
  transform:translateX(0);
}

.pa-kicker{
  margin:0 0 8px;
  color:#697a95;
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.pa-title{
  max-width:650px;
  margin:0;
  color:var(--pa-text);
  font-size:clamp(2.65rem,4vw,4.6rem);
  line-height:.96;
  letter-spacing:-.065em;
  font-weight:950;
}
.pa-title span{color:var(--pa-primary)}
.pa-tagline{
  max-width:620px;
  margin:12px 0 13px;
  color:var(--pa-muted);
  font-size:.91rem;
  line-height:1.5;
}
.pa-chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:13px}
.pa-chip{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:8px 12px;
  border:1px solid rgba(40,108,255,.12);
  border-radius:999px;
  background:color-mix(in srgb,var(--pa-card) 88%,transparent);
  color:var(--pa-muted);
  font-size:.71rem;
  font-weight:850;
}
.pa-chip i{color:var(--pa-primary)}

.pa-poster-wrap{
  flex:1;
  min-height:0;
  display:flex;
  align-items:center;
  justify-content:center;
}
.pa-poster{
  position:relative;
  width:100%;
  height:100%;
  max-height:420px;
  min-height:280px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  padding:12px;
  border:1px solid rgba(40,108,255,.10);
  border-radius:26px;
  background:color-mix(in srgb,var(--pa-card) 96%,#eef5ff);
  box-shadow:0 16px 40px rgba(15,23,42,.07);
}
.pa-poster:before{
  content:"";
  position:absolute;
  left:-55px;
  bottom:-55px;
  width:160px;
  height:160px;
  border-radius:50%;
  background:rgba(40,108,255,.07);
}
.pa-poster:after{
  content:"";
  position:absolute;
  right:-42px;
  top:-42px;
  width:130px;
  height:130px;
  border-radius:50%;
  background:rgba(115,87,255,.05);
}
.pa-poster img,
.pa-poster picture{
  position:relative;
  z-index:2;
  display:block!important;
  width:auto!important;
  max-width:94%!important;
  max-height:390px!important;
  height:auto!important;
  object-fit:contain!important;
  border-radius:18px!important;
  animation:pa-poster 7s ease-in-out infinite;
}
.pa-poster picture img{width:100%!important}
.pa-poster-empty{text-align:center;color:var(--pa-muted)}
.pa-poster-empty i{display:block;font-size:3.6rem;color:var(--pa-primary);margin-bottom:8px}

.pa-card{width:min(100%,540px);margin:auto}
.pa-brand{min-height:54px;display:flex;align-items:center;margin-bottom:10px}
.pa-brand img{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:235px!important;
  max-height:68px!important;
  object-fit:contain!important;
}
.pa-brand-fallback{display:flex;align-items:center;gap:10px;color:var(--pa-text);font-weight:900}
.pa-brand-fallback i{
  width:46px;height:46px;
  display:grid;place-items:center;
  border-radius:14px;
  background:color-mix(in srgb,var(--pa-primary) 10%,var(--pa-card));
  color:var(--pa-primary);
}

.pa-top{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}
.pa-heading h1{
  margin:0;
  color:var(--pa-text);
  font-size:clamp(2.3rem,3.4vw,3.7rem);
  line-height:.96;
  letter-spacing:-.055em;
  font-weight:950;
}
.pa-heading p{
  margin:7px 0 0;
  color:var(--pa-muted);
  font-size:.88rem;
}

.pa-form{
  display:block!important;
  width:100%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.pa-field{margin-bottom:12px}
.pa-field label{
  display:block;
  margin:0 0 6px;
  color:var(--pa-text);
  font-size:.79rem;
  font-weight:900;
}
.pa-input{position:relative}
.pa-input i{
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  color:#8d9ab0;
  pointer-events:none;
}
.pa-input input{
  width:100%!important;
  height:52px!important;
  padding:0 15px 0 42px!important;
  border:1px solid var(--pa-line)!important;
  border-radius:16px!important;
  outline:0!important;
  background:var(--pa-card)!important;
  color:var(--pa-text)!important;
  font-size:.94rem!important;
  box-shadow:none!important;
}
.pa-input input::placeholder{color:#9aa7ba!important;opacity:1!important}
.pa-input input:focus{
  border-color:var(--pa-primary)!important;
  box-shadow:0 0 0 4px rgba(40,108,255,.10)!important;
}
.pa-password{display:flex;align-items:center;gap:9px}
.pa-password .pa-input{flex:1}
.pa-eye{
  width:52px;height:52px;
  flex:0 0 52px;
  display:grid!important;
  place-items:center!important;
  border:1px solid var(--pa-line)!important;
  border-radius:16px!important;
  background:var(--pa-card)!important;
  color:#76869d!important;
  box-shadow:none!important;
}
.pa-eye:hover{color:var(--pa-primary)!important;border-color:rgba(40,108,255,.35)!important}

.pa-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:1px 0 13px;
}
.pa-remember{
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:var(--pa-text);
  font-size:.77rem;
  font-weight:850;
}
.pa-remember input{margin:0!important}
.pa-meta a{
  color:var(--pa-primary)!important;
  text-decoration:none!important;
  font-size:.77rem!important;
  font-weight:900!important;
}

.pa-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.pa-login-btn,
.pa-signup-btn{
  position:relative;
  overflow:hidden;
  width:100%!important;
  height:54px!important;
  border-radius:17px!important;
  font-size:.94rem!important;
  font-weight:950!important;
  transition:transform .16s ease,box-shadow .16s ease!important;
}
.pa-login-btn{
  border:0!important;
  color:#fff!important;
  background:linear-gradient(90deg,var(--pa-primary),var(--pa-primary2))!important;
  box-shadow:0 13px 26px rgba(40,108,255,.20)!important;
}
.pa-login-btn:before{
  content:"";
  position:absolute;
  top:-20%;
  bottom:-20%;
  width:36%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.34),transparent);
  animation:pa-shine 4.2s ease-in-out infinite;
}
.pa-signup-btn{
  border:1px solid rgba(24,179,107,.48)!important;
  color:var(--pa-green)!important;
  background:color-mix(in srgb,var(--pa-green) 5%,var(--pa-card))!important;
}
.pa-login-btn:hover,.pa-signup-btn:hover{transform:translateY(-1px)}
.pa-login-btn:active,.pa-signup-btn:active{transform:translateY(1px) scale(.995)}

.pa-app-fab{
  position:fixed!important;
  z-index:50!important;
  right:max(16px,env(safe-area-inset-right))!important;
  bottom:max(16px,env(safe-area-inset-bottom))!important;
  width:54px!important;
  height:54px!important;
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  border:1px solid rgba(115,87,255,.34)!important;
  border-radius:18px!important;
  background:var(--pa-card)!important;
  color:var(--pa-purple)!important;
  text-decoration:none!important;
  box-shadow:0 14px 30px rgba(15,23,42,.14)!important;
  transition:transform .16s ease,box-shadow .16s ease!important;
}
.pa-app-fab:hover{transform:translateY(-3px);box-shadow:0 18px 34px rgba(15,23,42,.18)!important}
.pa-app-fab i{font-size:1.35rem}
.pa-app-fab .pa-app-label{
  position:absolute;
  right:63px;
  white-space:nowrap;
  padding:7px 10px;
  border-radius:10px;
  background:var(--pa-text);
  color:var(--pa-card);
  font-size:.68rem;
  font-weight:850;
  opacity:0;
  transform:translateX(6px);
  pointer-events:none;
  transition:.16s ease;
}
.pa-app-fab:hover .pa-app-label{opacity:1;transform:none}

.pa-foot{
  margin-top:11px;
  padding-top:11px;
  border-top:1px solid var(--pa-line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  color:var(--pa-muted);
  font-size:.66rem;
}
.pa-foot i{color:var(--pa-primary)}

.pa-signup-head{
  height:64px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:0 18px;
  border-bottom:1px solid var(--pa-line);
  background:var(--pa-card);
}
.pa-signup-head .left{
  display:flex;
  align-items:center;
  gap:10px;
}
.pa-signup-head .icon{
  width:38px;height:38px;
  display:grid;place-items:center;
  border-radius:12px;
  background:color-mix(in srgb,var(--pa-green) 9%,var(--pa-card));
  color:var(--pa-green);
}
.pa-signup-head strong{display:block;color:var(--pa-text);font-size:.9rem}
.pa-signup-head small{display:block;color:var(--pa-muted);font-size:.65rem}
.pa-signup-head .head-actions{display:flex;align-items:center;gap:8px}
.pa-open-full,.pa-back-login{
  min-height:36px;
  padding:0 11px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  border:1px solid var(--pa-line);
  border-radius:11px;
  background:var(--pa-card);
  color:var(--pa-text);
  text-decoration:none;
  font-size:.7rem;
  font-weight:850;
}
.pa-signup-frame{
  width:100%;
  height:calc(100% - 64px);
  border:0;
  background:var(--pa-card);
}
.pa-signup-fallback{
  height:calc(100% - 64px);
  display:none;
  place-items:center;
  padding:22px;
  color:var(--pa-muted);
  text-align:center;
}

/* Forgot Password enhancement */
body.pa-forgot{
  background:linear-gradient(135deg,#02111f,#061b2f)!important;
}
body.pa-forgot .pa-forgot-card{
  width:min(520px,calc(100% - 28px));
  margin:auto;
  padding:28px;
  border:1px solid #173a55;
  border-radius:26px;
  background:rgba(4,24,40,.92);
  box-shadow:0 26px 70px rgba(0,0,0,.28);
  color:#f8fbff;
  animation:pa-in .35s ease-out;
}
body.pa-forgot .pa-forgot-card input{
  min-height:54px!important;
  border:1px solid #214c69!important;
  border-radius:14px!important;
  background:#061d31!important;
  color:#fff!important;
}
body.pa-forgot .pa-forgot-card button[type="submit"],
body.pa-forgot .pa-forgot-card input[type="submit"]{
  width:100%!important;
  min-height:54px!important;
  border:0!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,#1e73ff,#3f8cff)!important;
  color:#fff!important;
  font-weight:950!important;
}
body.pa-forgot .pa-key-orb{
  width:78px;height:78px;
  margin:0 auto 14px;
  display:grid;place-items:center;
  border-radius:50%;
  background:linear-gradient(145deg,#36a9ff,#4dc4ff);
  color:#fff;
  animation:pa-key 3s ease-in-out infinite;
}
body.pa-forgot .pa-key-orb i{font-size:1.8rem}

/* Signup / New Connection page theme */
body.pa-signup-page{
  min-height:100vh!important;
  min-height:100dvh!important;
  padding:18px!important;
  overflow:auto!important;
  background:
    radial-gradient(circle at 5% 5%,rgba(40,108,255,.08),transparent 22%),
    linear-gradient(135deg,#edf4ff,#f9fbff)!important;
}
body.pa-signup-page .pa-signup-card{
  width:min(760px,100%);
  margin:0 auto;
  padding:24px;
  border:1px solid var(--pa-line);
  border-radius:26px;
  background:#fff;
  box-shadow:0 22px 60px rgba(15,23,42,.10);
}
body.pa-signup-page .pa-signup-card input,
body.pa-signup-page .pa-signup-card select,
body.pa-signup-page .pa-signup-card textarea{
  width:100%!important;
  min-height:48px!important;
  border:1px solid #d7e1ee!important;
  border-radius:13px!important;
  background:#fff!important;
  box-shadow:none!important;
}
body.pa-signup-page .pa-signup-card textarea{min-height:94px!important}
body.pa-signup-page .pa-signup-card button[type="submit"],
body.pa-signup-page .pa-signup-card input[type="submit"]{
  min-height:50px!important;
  border:0!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,var(--pa-primary),var(--pa-primary2))!important;
  color:#fff!important;
  font-weight:950!important;
}
html.pa-embedded body.pa-signup-page{
  padding:0!important;
  background:#fff!important;
}
html.pa-embedded body.pa-signup-page .pa-signup-card{
  width:100%;
  min-height:100dvh;
  margin:0;
  padding:20px;
  border:0;
  border-radius:0;
  box-shadow:none;
}
html.pa-embedded body.pa-signup-page .pa-standalone-only{display:none!important}

/* Theme button */
.pa-theme{
  position:fixed!important;
  top:12px!important;
  right:12px!important;
  z-index:60!important;
  width:44px!important;height:44px!important;
  display:grid!important;place-items:center!important;
  border:1px solid var(--pa-line)!important;
  border-radius:14px!important;
  background:var(--pa-card)!important;
  color:var(--pa-text)!important;
  box-shadow:0 10px 26px rgba(15,23,42,.08)!important;
}
.pa-powered-hide{display:none!important}

@media(max-width:1100px){
  .pa-visual{padding:28px 28px 22px}
  .pa-login-pane{padding:25px 28px 22px}
  .pa-title{font-size:clamp(2.45rem,4vw,3.9rem)}
  .pa-poster img,.pa-poster picture{max-height:320px!important}
}
@media(max-width:860px){
  .pa-stage{padding:8px}
  .pa-ambient{display:none}
  .pa-shell{
    width:min(100%,470px);
    height:calc(100dvh - 16px);
    border-radius:25px;
  }
  .pa-visual{display:none}
  .pa-login-pane,
  .pa-signup-pane{
    width:100%;
    left:0;
    right:auto;
  }
  .pa-login-pane{
    padding:17px 14px 13px;
    transform:none!important;
  }
  .pa-signup-pane{
    z-index:5;
    transform:translateX(105%);
    opacity:1;
  }
  .pa-shell.is-signup .pa-login-pane{
    transform:translateX(-105%)!important;
    opacity:1;
  }
  .pa-shell.is-signup .pa-signup-pane{
    transform:translateX(0);
  }
  .pa-brand{min-height:46px;margin-bottom:7px}
  .pa-brand img{max-width:190px!important;max-height:52px!important}
  .pa-heading h1{font-size:2.12rem}
  .pa-heading p{font-size:.84rem;margin-top:5px}
  .pa-field{margin-bottom:10px}
  .pa-input input{height:48px!important;border-radius:14px!important;font-size:.91rem!important}
  .pa-eye{width:48px;height:48px;flex-basis:48px;border-radius:14px!important}
  .pa-actions{gap:8px}
  .pa-login-btn,.pa-signup-btn{height:50px!important;border-radius:15px!important;font-size:.89rem!important}
  .pa-foot{font-size:.61rem}
  .pa-app-fab{
    right:max(10px,env(safe-area-inset-right))!important;
    bottom:max(10px,env(safe-area-inset-bottom))!important;
    width:50px!important;height:50px!important;border-radius:16px!important;
  }
}
@media(max-width:430px){
  .pa-login-pane{padding:14px 11px 11px}
  .pa-brand img{max-width:170px!important;max-height:48px!important}
  .pa-heading h1{font-size:1.95rem}
  .pa-meta{font-size:.72rem}
}
