/* Nextura auth pages — implemented from "Nextura Auth Pages.dc.html", option 1b (Editorial minimal).
 * Big Sora type · Space Mono micro-labels · underline inputs · navy pill buttons. */
:root {
  --ink: #16294d;
  --ink-2: #3a4a63;
  --muted: #6b7a90;
  --faint: #8794a6;
  --ghost: #9aa6b6;
  --accent: #2A6FDB;
  --navy: #16294d;
  --navy-2: #1B3A6B;
  --rule: #DFE5EE;
  --hairline: #EDF1F7;
  --panel: #FAFBFD;
  --watermark: #EFF4FC;
  --err: #B4232A;
  --err-bg: #FCEDEE;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body { font-family: 'Sora', system-ui, sans-serif; background: #fff; color: var(--ink); }
input::placeholder { color: var(--ghost); }

.au-shell { display: flex; min-height: 100dvh; }

/* ============ Brand panel (left) ============ */
.au-brand { flex: 1; background: #fff; border-right: 1px solid var(--hairline); padding: 44px 48px; display: flex; flex-direction: column; position: relative; overflow: hidden; }
.au-logo { display: flex; align-items: center; gap: 11px; position: relative; z-index: 1; text-decoration: none; }
.au-logo b { font-weight: 700; font-size: 22px; letter-spacing: -0.7px; color: var(--ink); }
.au-brand__mid { margin-top: 96px; position: relative; z-index: 1; }
.au-kicker { font-family: 'Space Mono', monospace; font-size: 10.5px; letter-spacing: 4px; color: var(--faint); text-transform: uppercase; }
.au-brand__mid h2 { margin: 18px 0 0; font-weight: 800; font-size: 44px; letter-spacing: -2px; line-height: 1.12; color: var(--ink); }
.au-stats { margin-top: auto; position: relative; z-index: 1; display: flex; gap: 36px; padding-top: 40px; }
.au-stat b { display: block; font-weight: 700; font-size: 22px; letter-spacing: -0.5px; color: var(--ink); }
.au-stat span { display: block; font-size: 11.5px; color: var(--faint); margin-top: 3px; }
.au-watermark { position: absolute; right: -130px; bottom: -120px; color: var(--watermark); }

/* ============ Form panel (right) ============ */
.au-form { flex: 1; background: var(--panel); display: flex; align-items: center; justify-content: center; padding: 40px; }
.au-box { width: 340px; display: flex; flex-direction: column; gap: 26px; }
.au-box form { display: flex; flex-direction: column; gap: 26px; }
.au-mobilebrand { display: none; align-items: center; gap: 10px; text-decoration: none; }
.au-mobilebrand b { font-weight: 700; font-size: 19px; letter-spacing: -0.6px; color: var(--ink); }

.au-kicker--accent { font-size: 10px; letter-spacing: 3px; color: var(--accent); }
.au-box h1 { margin: 10px 0 0; font-weight: 800; font-size: 30px; letter-spacing: -1.2px; color: var(--ink); }
.au-lede { margin: 12px 0 0; font-size: 13.5px; line-height: 1.65; color: var(--muted); }

.au-field { display: flex; flex-direction: column; gap: 8px; }
.au-field__row { display: flex; align-items: baseline; justify-content: space-between; }
.au-label { font-family: 'Space Mono', monospace; font-size: 10px; letter-spacing: 2px; color: var(--faint); text-transform: uppercase; }
.au-input { width: 100%; height: 40px; padding: 0 2px; border: none; border-bottom: 1.5px solid var(--rule); background: transparent; font-family: 'Sora', sans-serif; font-size: 14px; color: var(--ink); outline: none; border-radius: 0; transition: border-color 150ms ease; }
.au-input:focus { border-bottom-color: var(--accent); }

.au-btn { height: 48px; border: none; border-radius: 999px; background: var(--navy); color: #fff; font-family: 'Sora', sans-serif; font-weight: 600; font-size: 14px; cursor: pointer; margin-top: 6px; transition: background-color 150ms ease; }
.au-btn:hover { background: var(--navy-2); }
.au-btn[disabled] { opacity: 0.6; cursor: default; }
.au-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.au-link { color: var(--accent); font-weight: 600; text-decoration: none; }
.au-link:hover { text-decoration: underline; }
.au-link--sm { font-size: 11.5px; }
.au-link:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
.au-foot { margin: 0; font-size: 13px; color: var(--muted); }
.au-terms { margin: 0; font-size: 11px; line-height: 1.6; color: var(--ghost); }

.au-error { display: none; padding: 10px 14px; border-radius: 10px; background: var(--err-bg); color: var(--err); font-size: 12.5px; line-height: 1.5; }
.au-error.on { display: block; }
[hidden] { display: none !important; }

/* ---- Social sign-in (Google / GitHub) ---- */
.au-alt { display: flex; align-items: center; gap: 12px; margin: 4px 0; }
.au-alt::before, .au-alt::after { content: ''; flex: 1; height: 1px; background: var(--rule); }
.au-alt span { font-family: 'Space Mono', monospace; font-size: 10px; letter-spacing: 2px; color: var(--faint); text-transform: uppercase; }
.au-social { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.au-sbtn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; height: 44px; border: 1.5px solid var(--rule); border-radius: 999px; background: #fff; color: var(--ink); font-family: 'Sora', sans-serif; font-weight: 600; font-size: 13px; text-decoration: none; transition: border-color 150ms ease, background-color 150ms ease; }
.au-sbtn:hover { border-color: var(--ink-2); background: var(--panel); }
.au-sbtn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.au-sbtn svg { flex-shrink: 0; }
@media (max-width: 480px) { .au-social { grid-template-columns: 1fr; } }

/* ============ Responsive ============ */
@media (max-width: 880px) {
  .au-brand { display: none; }
  .au-mobilebrand { display: flex; }
}
@media (max-width: 480px) {
  .au-form { padding: 28px 20px; }
  .au-box { width: 100%; max-width: 340px; }
}
@media (prefers-reduced-motion: reduce) {
  .au-input, .au-btn { transition: none; }
}