/* Sign in / sign up / password reset, in the landing's style (pgrun-export 3): the
   near-black ground, IBM Plex Mono, cool grey oklch text, hairline rounded borders and the
   blue CTA. Self-contained — layouts/auth loads it with chrome.css (the site menu) only. */

.au-body{
  margin:0; min-height:100vh; background:#0b0d0f; color:oklch(0.92 0.005 250);
  font-family:'IBM Plex Mono','Courier New',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:14.5px; line-height:1.6;
}
.au-body *{ box-sizing:border-box; }
.au-body ::selection{ background:oklch(0.55 0.10 235); color:#fff; }

/* The dot grid from the old auth panel, kept in the top-left corner: same 11px grid and
   ink, vignetted out from the corner. isolation + z-index:-1 keeps it behind everything,
   the menu included, which drops its own background here so the dots run under it. */
.au-body{ position:relative; isolation:isolate; }
.au-body::before{
  content:""; position:absolute; top:0; left:0; z-index:-1; pointer-events:none;
  width:min(760px, 100%); height:680px;
  background:radial-gradient(rgba(255,255,255,.10) 1px, transparent 1.4px) 0 0/11px 11px;
  -webkit-mask-image:radial-gradient(100% 100% at 0 0, #000 16%, transparent 70%);
          mask-image:radial-gradient(100% 100% at 0 0, #000 16%, transparent 70%);
}
.au-body header.site-menu{ background:transparent; }

.au a{ color:oklch(0.78 0.10 235); text-decoration:none; }
.au a:hover{ color:oklch(0.85 0.01 250); }

/* ---------- column ---------- */
/* Centred under the menu, with the hero's top spacing. */
.au{ display:flex; justify-content:center; padding:56px 20px 96px; }
.au-form{ width:400px; max-width:100%; }

.au-head{ margin-bottom:28px; text-align:center; }
.au-head h1{
  margin:0 0 10px; font-size:30px; font-weight:700; line-height:1.2; letter-spacing:-0.015em;
  color:oklch(0.92 0.005 250);
}
.au-head p{ margin:0; font-size:14.5px; color:oklch(0.66 0.01 250); }

/* ---------- disabled social buttons + divider ---------- */
.au-oauth{ display:flex; gap:10px; margin-bottom:20px; }
/* A configured provider is a button_to, so the form is the flex child, not the button. */
.au-oauth form{ flex:1; display:flex; margin:0; }
.au-oauth button{
  flex:1; display:flex; align-items:center; justify-content:center; gap:9px; height:42px;
  border:1px solid oklch(0.26 0.008 250); border-radius:6px; background:none;
  color:oklch(0.66 0.01 250); font:inherit; font-size:13.5px; font-weight:600;
  cursor:pointer;
}
.au-oauth button:hover{ border-color:oklch(0.38 0.01 250); color:oklch(0.88 0.005 250); }
/* Not configured yet — the button stays, visibly out of service. */
.au-oauth button:disabled{ cursor:not-allowed; opacity:.5; }
.au-oauth button:disabled:hover{ border-color:oklch(0.26 0.008 250); color:oklch(0.66 0.01 250); }
.au-or{ display:flex; align-items:center; gap:12px; margin-bottom:20px; }
.au-or i{ flex:1; border-top:1px solid oklch(0.24 0.008 250); }
.au-or span{
  font-size:11.5px; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  color:oklch(0.45 0.008 250);
}

/* ---------- fields ---------- */
.au-fields{ display:flex; flex-direction:column; gap:18px; margin:0; }
.au-label{ display:block; }
.au-label-row{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:8px; }
.au-label-t{
  display:block; margin-bottom:8px; font-size:12px; font-weight:600; letter-spacing:.08em;
  text-transform:uppercase; color:oklch(0.55 0.01 250);
}
.au-label-row .au-label-t{ margin-bottom:0; }

/* Cloudflare Turnstile on sign-up: reserve the widget's 65px so the button doesn't jump. */
.au-captcha{ min-height:65px; }

/* The landing's install-command box: hairline border, 6px radius, blue on focus. */
.au-input{
  display:flex; align-items:center; gap:10px; height:44px; padding:0 14px;
  border:1px solid oklch(0.32 0.008 250); border-radius:6px; background:#0d0f12;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.au-input:focus-within{ border-color:oklch(0.72 0.11 235); box-shadow:0 0 0 3px oklch(0.72 0.11 235 / .18); }
.au-input > span{ display:flex; flex-shrink:0; color:oklch(0.5 0.01 250); }
.au-input input{
  flex:1; width:100%; height:100%; padding:0; border:0; background:none; outline:none;
  font:inherit; font-size:14px; color:oklch(0.92 0.005 250);
}
.au-input input::placeholder{ color:oklch(0.42 0.008 250); }
.au-input input[type="password"]{ letter-spacing:.1em; }
.au-input input[type="password"]::placeholder{ letter-spacing:normal; }
/* Keep browser autofill from painting the field pale yellow/blue. */
.au-input input:-webkit-autofill{
  -webkit-text-fill-color:oklch(0.92 0.005 250);
  -webkit-box-shadow:0 0 0 40px #0d0f12 inset; caret-color:oklch(0.92 0.005 250);
}

/* ---------- submit ---------- */
/* The landing's "sign up" / "Connect your Postgres" button, full width. */
.au .au-btn{
  display:flex; align-items:center; justify-content:center; gap:9px;
  width:100%; height:46px; margin-top:4px;
  border:0; border-radius:6px; background:oklch(0.72 0.11 235); color:#0b0d0f;
  font:inherit; font-size:14.5px; font-weight:600; cursor:pointer;
  transition:background-color .15s ease;
}
.au .au-btn:hover{ background:oklch(0.78 0.10 235); color:#0b0d0f; }
.au .au-btn:focus-visible{ outline:2px solid oklch(0.85 0.01 250); outline-offset:2px; }

.au-alt{ margin:24px 0 0; text-align:center; font-size:13.5px; color:oklch(0.62 0.01 250); }
.au-fine{ font-size:12px; line-height:1.6; color:oklch(0.5 0.01 250); }
.au-forgot{ font-size:12.5px; }

/* ---------- validation errors + flash ---------- */
/* Red is the landing's ✕, green its ✓. */
.au-errors{
  padding:12px 14px; border:1px solid oklch(0.63 0.19 25 / .45); border-radius:6px;
  background:oklch(0.63 0.19 25 / .08); font-size:13px; color:oklch(0.85 0.01 250);
}
.au-errors h2{
  margin:0 0 6px; font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  color:oklch(0.72 0.15 25);
}
.au-errors ul{ list-style:none; margin:0; padding:0; }
.au-errors li{ margin-top:3px; }
.au-errors li::before{ content:"✕ "; color:oklch(0.63 0.19 25); }

.au-flash{
  margin:0 0 22px; padding:10px 14px; border:1px solid oklch(0.75 0.11 160 / .45); border-radius:6px;
  background:oklch(0.75 0.11 160 / .08); font-size:13.5px; color:oklch(0.85 0.06 160);
}
.au-flash-alert{
  border-color:oklch(0.63 0.19 25 / .45); background:oklch(0.63 0.19 25 / .08); color:oklch(0.82 0.08 25);
}

@media (prefers-reduced-motion: reduce){
  .au-input, .au .au-btn{ transition:none; }
}

/* Sign-up honeypot (SignupGuard): off-screen, not display:none, so naive bots still fill it. */
.au-hp { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }