/* ============================================================
   login.php — AUTH SCREEN
   ============================================================ */
body{ display:grid; place-items:center; min-height:100dvh; padding: 24px; }

.auth-shell{
  width: min(960px, 100%);
  display:grid; grid-template-columns: 1.05fr .95fr;
  background: var(--bg-elev-1);
  border:1px solid var(--line);
  border-radius: var(--r-xl);
  overflow:hidden;
  box-shadow: var(--shadow-2);
  position:relative;
  isolation:isolate;
  animation: ash-fade-up .8s var(--ease-out) both;
}
.auth-shell::before{
  content:""; position:absolute; inset:-2px; border-radius: inherit;
  background: var(--aurora); opacity:.4; z-index:-1; filter: blur(40px);
}

.auth-brand{
  position:relative;
  padding: clamp(28px, 4vw, 48px);
  background:
    radial-gradient(120% 80% at 0% 0%, hsl(var(--au-cyan)/.18), transparent 55%),
    radial-gradient(120% 80% at 100% 100%, hsl(var(--au-magenta)/.18), transparent 55%),
    var(--bg-elev-2);
  display:flex; flex-direction:column; justify-content:space-between;
  gap: 2rem;
  min-height: 480px;
}
.auth-brand__logo{ display:flex; align-items:center; gap:.6rem; }
.auth-brand__title{
  font-size: clamp(32px, 3.5vw, 44px);
  letter-spacing:-.03em; line-height:1.05;
}
.auth-brand__lede{ color: var(--ink-soft); margin-top:.8rem; max-width: 360px; }
.auth-brand__quote{
  font-family: var(--font-mono);
  font-size:.78rem; color: var(--ink-mute);
  letter-spacing:.04em;
  border-left: 2px solid hsl(var(--au-violet));
  padding-left: 1rem;
}

.auth-form{
  padding: clamp(28px, 4vw, 48px);
  display:flex; flex-direction:column; justify-content:center; gap: 1rem;
}
.auth-form h2{ font-size: 1.4rem; }
.auth-form p.sub{ color: var(--ink-mute); font-size:.88rem; }
.auth-error{
  padding: .8rem 1rem;
  background: hsl(0 70% 50% / .12);
  border: 1px solid hsl(0 70% 60% / .35);
  border-radius: var(--r-sm);
  color: hsl(0 90% 80%);
  font-size:.85rem;
}
.auth-form .row{ display:flex; align-items:center; justify-content:space-between; font-size:.85rem; color: var(--ink-mute); }
.auth-form .check{ display:inline-flex; align-items:center; gap:.5em; cursor:pointer; }
.auth-form .check input{
  appearance:none; -webkit-appearance:none;
  width:16px; height:16px; border-radius: var(--r-xs);
  border: 1.5px solid var(--line-strong); background: var(--bg-elev-2);
  display:grid; place-items:center; cursor:pointer;
  transition: background var(--t-fast), border-color var(--t-fast);
}
.auth-form .check input:checked{
  background: var(--aurora); border-color: transparent;
}
.auth-form .check input:checked::after{
  content:""; width:8px; height:5px;
  border:2px solid #fff; border-top:0; border-right:0;
  transform: translateY(-1px) rotate(-45deg);
}
.auth-form a{ color: hsl(var(--au-cyan)); }
.auth-form a:hover{ text-decoration: underline; }
.auth-foot{
  margin-top: 1rem; font-size:.8rem; color: var(--ink-faint);
  text-align:center;
}

@media(max-width: 720px){
  .auth-shell{ grid-template-columns: 1fr; }
  .auth-brand{ min-height: 0; }
}
