/* PLNP login presentation. */
.login-page {
  min-height: 100vh;
  min-height: 100svh;
  background: #f5f7f4;
}
.login-page .auth-shell {
  min-height: 100vh;
  min-height: 100svh;
  grid-template-columns: minmax(0, 1.08fr) minmax(440px, .92fr);
  background: #f5f7f4;
}
.login-page .auth-brand-panel {
  isolation: isolate;
  overflow: hidden;
  min-width: 0;
  padding: clamp(30px, 4.2vw, 72px);
  background-color: #032e2c;
  background-image:
    linear-gradient(180deg, rgba(0, 34, 31, .18), rgba(0, 34, 31, .52)),
    url('../images/login-background-clean.png');
  background-position: center, 88% center;
  background-size: cover, cover;
  background-repeat: no-repeat;
}
.login-page .auth-brand-panel::after {
  z-index: -1;
  background: linear-gradient(90deg, rgba(0, 35, 32, .17), rgba(0, 35, 32, .02));
}
.login-page .auth-logo {
  width: clamp(150px, 16vw, 230px);
  max-height: 82px;
  object-fit: contain;
  filter: brightness(0) invert(1) drop-shadow(0 2px 12px rgba(0, 0, 0, .3));
}
.login-page .auth-copy {
  max-width: 580px;
  text-shadow: 0 2px 16px rgba(0, 0, 0, .38);
}
.login-page .auth-copy .eyebrow {
  color: #ffd451;
}
.login-page .auth-copy h1 {
  max-width: 570px;
  font-size: clamp(34px, 3.05vw, 54px);
  line-height: 1.04;
  letter-spacing: -.035em;
  margin: 12px 0 10px;
}
.login-page .auth-copy p {
  max-width: 480px;
  color: #e0efeb;
  font-size: 14px;
  line-height: 1.6;
}
.login-page .auth-card {
  width: min(520px, calc(100% - 72px));
  min-width: 0;
  min-height: 0;
  margin: auto;
  padding: clamp(30px, 3.3vw, 50px);
  border: 1px solid #e7ece8;
  border-radius: 22px;
  background: rgba(255, 255, 255, .97);
  box-shadow: 0 22px 64px rgba(16, 49, 39, .1);
}
.login-page .auth-card .eyebrow {
  margin: 0 0 8px;
  color: #b48616;
}
.login-page .auth-card h2 {
  margin: 0 0 6px;
  color: #102d29;
  font-size: clamp(30px, 2.3vw, 38px);
  letter-spacing: -.035em;
}
.login-page .auth-card > .muted {
  margin: 0 0 26px;
  color: #687a76;
  font-size: 14px;
}
.login-page .stack-form {
  gap: 16px;
}
.login-page .stack-form label {
  color: #293e3a;
  font-size: 12px;
  font-weight: 750;
}
.login-page .stack-form input {
  min-height: 48px;
  margin-top: 7px;
  padding: 0 14px;
  border-color: #d9e3df;
  border-radius: 9px;
  font-size: 14px;
  transition: border-color .15s, box-shadow .15s;
}
.login-page .stack-form input:focus {
  border-color: #08765e;
  box-shadow: 0 0 0 3px rgba(8, 118, 94, .12);
}
.login-page .stack-form .btn.primary {
  min-height: 49px;
  margin-top: 3px;
  border-radius: 9px;
  font-size: 14px;
}
.login-page .subtle-link {
  display: inline-block;
  margin-top: 20px;
  color: #54716a;
  font-size: 12px;
}
.login-page .auth-card-logo {
  display: none;
}
@media (max-width: 900px) {
  .login-page .auth-shell {
    grid-template-columns: minmax(0, 1fr) minmax(380px, .92fr);
  }
  .login-page .auth-brand-panel {
    padding: 30px;
  }
  .login-page .auth-card {
    width: min(calc(100% - 36px), 500px);
    padding: 30px;
  }
}
@media (max-width: 760px) {
  .login-page .auth-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(210px, 30svh) 1fr;
  }
  .login-page .auth-brand-panel {
    display: flex;
    min-height: 210px;
    padding: 22px 24px;
    background-position: center, center;
  }
  .login-page .auth-logo {
    width: 145px;
    max-height: 54px;
  }
  .login-page .auth-copy {
    max-width: 520px;
  }
  .login-page .auth-copy .eyebrow {
    font-size: 9px;
  }
  .login-page .auth-copy h1 {
    max-width: 470px;
    font-size: clamp(23px, 5vw, 32px);
    margin: 7px 0 5px;
  }
  .login-page .auth-copy p {
    margin: 0;
    font-size: 11px;
  }
  .login-page .auth-card {
    width: min(calc(100% - 28px), 500px);
    margin: 18px auto 26px;
    padding: 24px;
    border-radius: 17px;
  }
  .login-page .auth-card-logo {
    display: block;
    width: 135px;
    margin: 0 0 20px;
  }
}
@media (max-width: 420px) {
  .login-page .auth-shell {
    grid-template-rows: 190px 1fr;
  }
  .login-page .auth-brand-panel {
    min-height: 190px;
    padding: 18px 20px;
  }
  .login-page .auth-copy h1 {
    font-size: 23px;
  }
  .login-page .auth-card {
    padding: 21px 19px;
  }
}

/* Public invitation link card */
.login-page .invite-link {
  display: flex;
  align-items: center;
  gap: 13px;
  width: 100%;
  margin-top: 20px;
  padding: 13px 15px;
  color: #173b34;
  text-decoration: none;
  background: #f5faf8;
  border: 1px solid #dceae4;
  border-radius: 12px;
  transition: background .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.login-page .invite-link:hover {
  color: #0a604b;
  background: #eef7f3;
  border-color: #b9d9cc;
  box-shadow: 0 6px 18px rgba(15, 86, 65, .08);
  transform: translateY(-1px);
}
.login-page .invite-link-icon {
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 18px;
  font-weight: 800;
  background: linear-gradient(145deg, #0b795d, #075543);
  border-radius: 10px;
}
.login-page .invite-link-copy {
  display: grid;
  gap: 3px;
}
.login-page .invite-link-copy strong {
  font-size: 12px;
  line-height: 1.25;
}
.login-page .invite-link-copy small {
  color: #6d817a;
  font-size: 11px;
  line-height: 1.3;
}
.login-page .invite-link-arrow {
  margin-left: auto;
  color: #0b795d;
  font-size: 18px;
  font-weight: 800;
  transition: transform .18s ease;
}
.login-page .invite-link:hover .invite-link-arrow {
  transform: translateX(3px);
}

/* Premium sign-in: framed artwork, calm form surface, warm gold accents. */
.login-page{padding:28px;background:radial-gradient(ellipse at 5% 0%,#dcece5,transparent 55%),#f0f3f0}
.login-page .auth-shell{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);width:min(1480px,100%);min-height:calc(100svh - 56px);margin:auto;border:1px solid #fff;border-radius:28px;overflow:hidden;background:linear-gradient(135deg,#fcfdfb,#f4f7f3);box-shadow:0 24px 80px #072e3612}
.login-page .auth-brand-panel{display:flex;flex-direction:column;justify-content:space-between;padding:clamp(32px,4vw,64px);min-height:700px;border-radius:24px;background-image:linear-gradient(180deg,#062a3966 0%,#05392e1a 35%,#041e2bf5 100%),url('../images/login-background-clean.png');background-position:center,65% center}
.login-page .auth-brand-panel::after{background:linear-gradient(120deg,#052d3940,transparent 65%)}
.login-page .auth-logo{width:170px;max-height:65px;align-self:flex-start}
.login-page .auth-copy{position:relative;padding-top:30px;max-width:530px}
.login-page .auth-copy:before{content:'';display:block;width:50px;height:3px;margin-bottom:24px;border-radius:3px;background:linear-gradient(90deg,#f7d876,#b98b28)}
.login-page .auth-copy .eyebrow{font-size:10px;letter-spacing:.2em;color:#f3d584}
.login-page .auth-copy h1{margin:18px 0;font-size:clamp(32px,3.2vw,49px);line-height:1.14;letter-spacing:-.045em;color:#fff;text-wrap:balance}
.login-page .auth-copy p{font-size:14px;line-height:1.8;color:#d1e1df;margin:0;max-width:380px}
.login-page .auth-card{position:relative;width:min(460px,calc(100% - 80px));margin:48px auto;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;align-self:center}
.login-page .auth-card-logo{display:block;width:125px;height:auto;margin:0 0 42px}
.login-page .auth-card .eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:10px;letter-spacing:.17em;color:#80621f;margin:0 0 15px}
.login-page .auth-card .eyebrow:before{content:'';width:6px;height:6px;border-radius:50%;background:#b8943c;box-shadow:0 0 0 4px #e7d5a330}
.login-page .auth-card h2{font-size:clamp(32px,3vw,42px);line-height:1.15;color:#102f3d;margin:0 0 12px}
.login-page .auth-card>.muted{font-size:15px;line-height:1.7;margin:0 0 32px;color:#657b80}
.login-page .stack-form{display:grid;gap:18px}
.login-page .stack-form label{font-size:13px;font-weight:650;color:#25414c}
.login-page .stack-form input{width:100%;min-width:0;min-height:54px;padding:0 16px;margin-top:9px;border:1px solid #d3dfda;border-radius:11px;background:#fff;color:#183e49;font-size:14px;font-weight:450;outline:none}
.login-page .stack-form input::placeholder{color:#84948f;opacity:1;font-weight:400}
.login-page .stack-form input:focus{border-color:#08765e;box-shadow:0 0 0 4px #08765e12}
.login-password-field{position:relative;margin-top:-10px}
.login-page .login-password-field input{margin:0;padding-right:76px}
.password-toggle{position:absolute;right:8px;top:7px;display:grid;place-items:center;height:40px;width:40px;padding:0;border:0;border-radius:7px;background:transparent;color:#54766b;cursor:pointer}
.password-toggle:hover{background:#eff5f1;color:#09634d}
.password-eye-slash{display:none}
.password-toggle[aria-pressed="true"] .password-eye-slash{display:block}
.password-toggle[hidden]{display:none}
.login-page .stack-form .btn.primary{min-height:54px;margin-top:6px;border:1px solid #e8c166;border-radius:11px;color:#133b42;background:linear-gradient(115deg,#ffe8a0,#efc45b 65%,#f9d982);box-shadow:inset 0 1px 0 #fff8,0 8px 20px #c29c3520;font-size:14px;transition:transform .2s,box-shadow .2s}
.login-page .stack-form .btn.primary:hover{transform:translateY(-2px);box-shadow:0 10px 24px #b88c342b}
.login-page .subtle-link{font-size:13px;color:#12634f;font-weight:600;margin-top:22px}
.login-page .subtle-link:not(.invite-link):hover{text-decoration:underline;text-underline-offset:4px}
.login-page .invite-link{margin-top:30px;border:1px solid #dce5de;border-radius:13px;padding:16px;background:linear-gradient(110deg,#eef5ef,#fcfdfb);gap:13px}
.login-page .invite-link-icon{background:linear-gradient(135deg,#0d6b55,#083d48);width:40px;height:40px;flex-basis:40px;border:1px solid #ffffff60}
.login-page .invite-link-copy strong{font-size:13px;font-weight:650}
.login-page .invite-link-copy small{font-size:12px;line-height:1.5;font-weight:400}
.login-page a:focus-visible,.login-page button:focus-visible{outline:3px solid #17856a;outline-offset:4px}
@media(min-width:761px) and (max-width:1050px){.login-page{padding:16px}.login-page .auth-shell{min-height:calc(100svh - 32px)}.login-page .auth-brand-panel{padding:32px;min-height:680px}.login-page .auth-card{width:calc(100% - 48px)}.login-page .auth-copy h1{font-size:34px}}
@media(max-width:760px){.login-page{padding:12px}.login-page .auth-shell{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto;min-height:calc(100svh - 24px);border-radius:22px}.login-page .auth-brand-panel{min-height:0;padding:28px;border-radius:18px;gap:32px;background-position:center,center 55%}.login-page .auth-logo{width:125px;max-height:48px}.login-page .auth-copy{padding:0;max-width:520px}.login-page .auth-copy:before{margin-bottom:14px;width:36px}.login-page .auth-copy h1{font-size:clamp(27px,6.5vw,36px);margin:12px 0;max-width:440px}.login-page .auth-copy p{font-size:12px;max-width:350px}.login-page .auth-card{width:100%;padding:32px 26px;margin:0;border-radius:0}.login-page .auth-card-logo{display:none}.login-page .auth-card h2{font-size:32px}.login-page .auth-card>.muted{margin-bottom:26px}.login-page .invite-link{margin-top:26px}}
@media(prefers-reduced-motion:reduce){.login-page button,.login-page a,.login-page input{transition:none!important}.login-page .btn:hover,.login-page .invite-link:hover{transform:none}}

/* Dawn cityscape and luminous navy/emerald sign-in surface. */
.login-page{background:radial-gradient(ellipse at 95% 0%,#13715c66,transparent 58%),linear-gradient(125deg,#041f32,#083e43 58%,#07513f)}
.login-page .auth-shell{border-color:#ffffff24;background:radial-gradient(ellipse at 100% 0%,#e5f1e9 0%,transparent 70%),linear-gradient(135deg,#fbfcf6,#edf5f0);box-shadow:0 28px 90px #00131e4d}
.login-page .auth-brand-panel{background-color:#063b3f;background-image:linear-gradient(180deg,#031d3030 0%,#063a3320 42%,#031e32f2 100%),url('../images/login-cityscape-v1.png');background-position:center,center;background-size:cover}
.login-page .auth-card h2{color:#123d49;background-image:linear-gradient(110deg,#123d49 15%,#08674f 35%,#123d49 46%,#c5a35c 50%,#fff3c5 52%,#0b6751 57%,#123d49 75%);background-size:260% 100%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:login-heading-shine 8s ease-in-out infinite}
.login-page .stack-form .btn.primary{position:relative;isolation:isolate;overflow:hidden;min-height:56px;background:linear-gradient(115deg,#ffedb1 0%,#f4cf6a 36%,#e9b83d 70%,#ffe194 100%);border-color:#d7b456;box-shadow:inset 0 1px 0 #fff9,0 9px 22px #ae882a25;letter-spacing:.02em}
.login-page .stack-form .btn.primary:before{content:'';position:absolute;z-index:-1;inset:-70% -50%;pointer-events:none;background:linear-gradient(105deg,transparent 38%,#ffffff70 49%,transparent 60%);transform:translateX(-70%);animation:login-button-shine 7s ease-in-out infinite}
.login-page .stack-form .btn.primary:hover{box-shadow:inset 0 1px 0 #fffc,0 13px 28px #ae882a38;filter:brightness(1.025)}
.login-page .stack-form .btn.primary:active{transform:translateY(0);box-shadow:inset 0 2px 5px #ae882a20}
@keyframes login-heading-shine{0%,58%{background-position:100% 50%}88%,100%{background-position:0% 50%}}
@keyframes login-button-shine{0%,70%{transform:translateX(-70%)}94%,100%{transform:translateX(70%)}}
.login-transition{position:fixed;inset:0;z-index:10000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;padding:24px;background:radial-gradient(ellipse at top right,#106550,transparent 65%),linear-gradient(135deg,#041e32,#063e3d);color:#e4eee8;animation:login-transition-enter .2s ease-out}
.login-transition[hidden]{display:none}
.login-transition-logo{width:170px;height:auto;filter:brightness(0) invert(1)}
.login-transition-spinner{width:42px;height:42px;border:3px solid #ffffff20;border-top-color:#f4d17b;border-right-color:#ceab52;border-radius:50%;animation:login-loading-spin .85s linear infinite}
.login-transition p{margin:0;font-size:14px;letter-spacing:.03em;text-align:center}
@keyframes login-transition-enter{from{opacity:0}to{opacity:1}}
@keyframes login-loading-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.login-transition,.login-transition-spinner{animation:none}}
@media(prefers-reduced-motion:reduce){.login-page .auth-card h2{animation:none;background:none;-webkit-text-fill-color:currentColor}.login-page .stack-form .btn.primary:before{animation:none;display:none}}