/* The doorway to Central: warm paper for the task, architectural study for identity. */
.login-os { min-height:100dvh; color:var(--lp-ink); background:var(--lp-bg); }
.login-os [hidden] { display:none!important; }
.login-os :is(button,input):focus-visible { outline:2px solid var(--lp-accent-ink); outline-offset:4px; }
.login-os svg { width:18px; height:18px; flex-shrink:0; stroke-width:1.5; }
.login-shell { display:grid; grid-template-columns:1.05fr 1fr; min-height:100dvh; padding:22px; gap:30px; max-width:1920px; margin:auto; }
.login-story { display:flex; position:relative; flex-direction:column; justify-content:space-between; min-height:660px; background:var(--lp-night); color:var(--lp-night-text); border-radius:var(--lp-radius-md); overflow:hidden; padding:40px; isolation:isolate; }
.login-story-brand { width:226px; position:relative; z-index:2; }
.login-story-art { position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,var(--lp-night) 1%,transparent 28%,var(--lp-night) 84%),url('/assets/login-architecture-study.webp') 20% 40% / auto 110% no-repeat; opacity:.85; }
.login-story-copy { margin-top:auto; padding-top:340px; }
.login-eyebrow { font-size:10px; line-height:1.6; letter-spacing:.15em; font-weight:600; color:var(--lp-accent-ink); }
.login-story .login-eyebrow { color:var(--lp-gold); }
.login-story h2 { font-size:clamp(31px,3vw,46px); margin:20px 0 17px; }
.login-story-copy>p:last-child { color:var(--lp-night-muted); font-size:13px; line-height:1.85; }
.login-story-footer { display:flex; align-items:center; gap:18px; padding-top:42px; font-size:8px; letter-spacing:.12em; color:var(--lp-night-muted); }
.login-story-rule { flex:1; height:1px; background:var(--lp-night-line); }
.login-access { padding:26px clamp(22px,4vw,70px) 15px; display:flex; flex-direction:column; }
.login-access-header { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.login-access-label { display:flex; align-items:center; gap:8px; font-size:10px; color:var(--lp-muted); }
.login-access-label svg { width:15px; height:15px; }
.login-mobile-brand { display:none; }
.login-container { width:100%; max-width:385px; margin:auto; padding:52px 0; opacity:1; }
.login-title { font-size:clamp(36px,3.4vw,48px); margin:15px 0; }
.login-intro { font-size:13px; line-height:1.7; color:var(--lp-muted); margin-bottom:32px; }
.form-group { margin-bottom:22px; }
.form-label { display:block; font-size:12px; font-weight:600; margin-bottom:10px; }
.form-input { width:100%; min-height:54px; border:1px solid var(--lp-line-strong); border-radius:var(--lp-radius-sm); padding:14px 16px; font-size:16px; color:var(--lp-ink); background:var(--lp-surface); }
.form-input::placeholder { color:var(--lp-muted); font-size:13px; }
.form-input:focus { border-color:var(--lp-accent-ink); }
.form-input:autofill { -webkit-text-fill-color:var(--lp-ink); box-shadow:inset 0 0 0 100px var(--lp-surface); }
.login-password-wrap { position:relative; }
.login-password-wrap input { padding-right:58px; }
#login-show-password { position:absolute; right:5px; top:5px; width:44px; height:44px; border:0; border-radius:5px; background:transparent; color:var(--lp-muted); cursor:pointer; display:grid; place-items:center; }
#login-show-password[aria-pressed=true] { color:var(--lp-ink); background:var(--lp-accent-soft); }
.login-caps { margin-top:9px; font-size:12px; color:var(--lp-accent-ink); }
.login-feedback { background:var(--lp-danger-soft); border-left:2px solid var(--lp-danger); padding:12px 14px; margin-bottom:18px; font-size:12px; line-height:1.65; color:var(--lp-danger-ink); }
.login-feedback.success { background:var(--lp-success-soft); border-color:var(--lp-success); color:var(--lp-success); }
.btn-login { display:flex; align-items:center; justify-content:center; gap:12px; min-height:54px; width:100%; padding:14px 20px; border:1px solid var(--lp-ink); border-radius:var(--lp-radius-sm); color:var(--lp-surface); background:var(--lp-ink); font-size:14px; cursor:pointer; }
.btn-login>svg { margin-left:auto; }
#btn-text-login { margin-right:auto; }
.btn-login:disabled { cursor:wait; opacity:.65; }
.spinner { display:none; height:16px; width:16px; border:2px solid var(--lp-night-line); border-top-color:var(--lp-night-text); border-radius:50%; animation:login-spin .8s linear infinite; }
.login-access-help { margin-top:20px; color:var(--lp-muted); font-size:11px; line-height:1.9; }
.login-access-footer { display:flex; flex-direction:column; gap:8px; color:var(--lp-muted); font-size:10px; }
.login-access-footer>span:first-child { letter-spacing:.13em; font-size:9px; }
@keyframes login-spin { to { transform:rotate(360deg); } }
@media(hover:hover) { .btn-login:not(:disabled):hover { background:var(--lp-accent-ink); border-color:var(--lp-accent-ink); } #login-show-password:hover { background:var(--lp-accent-soft); } }
@media(prefers-reduced-motion:no-preference) { .login-container,.login-story-copy { animation:login-enter .45s var(--lp-ease) both; }.btn-login,.form-input { transition:background .18s,border-color .18s; } @keyframes login-enter { from {opacity:0;transform:translateY(8px)} to {opacity:1;transform:none} } }
@media(prefers-reduced-motion:reduce) { .spinner { animation:none; } }
@media(max-width:1050px) { .login-shell { gap:8px; padding:16px; }.login-story { padding:28px; }.login-access { padding:22px 28px 15px; }.login-access-label span { display:none; }.login-story-footer { gap:10px; font-size:7px; } }
@media(max-width:760px) {
  .login-shell { display:block; padding:0; }.login-story { display:none; }.login-access { min-height:100dvh; padding:max(28px,env(safe-area-inset-top)) 28px max(24px,env(safe-area-inset-bottom)); }
  .login-desktop-context { display:none; }.login-mobile-brand { display:block; width:190px; height:auto; }.login-access-header { padding-bottom:24px; border-bottom:1px solid var(--lp-line); }
  .login-access-label { margin-left:auto; }.login-container { max-width:400px; padding:38px 0; }.login-title { font-size:39px; margin:12px 0; }.login-intro { margin-bottom:27px; }.login-form-eyebrow { font-size:9px; }
  .login-access-footer { margin-top:8px; font-size:10px; }
}
@media(max-width:760px) and (max-height:730px) {
  .login-access { padding:22px 24px; }.login-access-header { padding-bottom:18px; }.login-mobile-brand { width:174px; }.login-container { padding:25px 0; }.login-title { font-size:33px; }.login-title br { display:none; }.login-intro { margin-bottom:22px; }.form-group { margin-bottom:18px; }.login-access-help { margin-top:16px; }.login-access-footer>span:last-child { display:none; }
}
@media(max-width:360px) { .login-access { padding-left:20px; padding-right:20px; }.login-title { font-size:31px; }.login-eyebrow { font-size:9px; }.login-mobile-brand { width:174px; } }
@media(forced-colors:active) { .login-story-art { display:none; }.btn-login { border:1px solid ButtonText; }.login-feedback { border:1px solid CanvasText; } }
