.auth-page { background:#f4f7fb; }
.auth-shell { min-height:100svh; }
.auth-shell .auth-side { flex:0 0 42%; max-width:560px; padding:2.5rem clamp(1.75rem,4vw,4rem); background:linear-gradient(155deg,#10263e,#143854); border-right:1px solid #203f5c; }
.auth-shell .auth-side::before { background:radial-gradient(ellipse at 0 0,rgba(91,163,213,.16),transparent 65%); }
.auth-side-content { min-height:580px; }
.auth-side-brand { gap:.7rem; margin-bottom:4rem; font-size:1.05rem; font-weight:700; }
.auth-side-brand .badge-icon { width:34px; height:40px; flex-shrink:0; }
.auth-side-brand small { display:block; margin-top:.2rem; color:#a4bbce; font-size:.66rem; font-weight:400; letter-spacing:.025em; }
.auth-side-heading { max-width:340px; margin-bottom:1rem; font-size:1.4rem; font-weight:650; line-height:1.45; letter-spacing:-.03em; }
.auth-side-sub { max-width:320px; color:#b0c4d7; font-size:.8rem; line-height:1.8; }
.auth-feature-list { gap:1.1rem; padding-top:1.5rem; margin-bottom:2.25rem; }
.auth-feature-item { gap:.8rem; color:#a9c0d4; font-size:.73rem; line-height:1.65; }
.auth-feature-item > i { display:grid; place-items:center; flex:0 0 30px; height:30px; margin-top:0; border:1px solid #35516a; border-radius:8px; background:rgba(255,255,255,.04); color:#98cbea; font-size:.8rem; }
.auth-feature-item strong { margin-bottom:.15rem; color:#edf4fa; font-size:.77rem; font-weight:600; }
.auth-side-footer { border-top:1px solid #35516a; padding-top:1.1rem; color:#9bb4ca; font-size:.64rem; }
.auth-shell .auth-form-side { flex:1; min-width:0; flex-direction:column; gap:1.5rem; padding:2.5rem 1.5rem; background:#f4f7fb; }
.auth-form-box { max-width:420px; padding:2rem; border:1px solid #e1e8f0; border-radius:16px; background:#fff; box-shadow:0 8px 32px rgba(22,48,74,.05); }
.auth-step-icon { display:grid; place-items:center; width:40px; height:40px; margin-bottom:1.4rem; border:1px solid #d8e8f5; border-radius:11px; background:#edf5fc; color:#246c9f; font-size:1rem; }
.auth-form-box .form-eyebrow { margin-bottom:.45rem; color:#5c7892; font-size:.61rem; font-weight:650; letter-spacing:.1em; }
.auth-form-box h3 { font-size:1.125rem; line-height:1.4; letter-spacing:-.025em; }
.auth-form-box .form-lede { margin-bottom:1.5rem; color:#687c8e; font-size:.78rem; line-height:1.7; overflow-wrap:anywhere; }
.auth-form-box .form-label { margin-bottom:.45rem; color:#344d64; font-size:.75rem; }
.auth-form-box .form-control,
.auth-form-box input[type="text"],
.auth-form-box input[type="password"],
.auth-form-box input[type="email"] { min-height:42px; border-color:#dce4ed; border-radius:8px; background:#fcfdff; font-size:.8125rem; }
.auth-form-box .field-icon-wrap input { padding-left:2.4rem; }
.auth-form-box input:focus { border-color:#448cbe; background:#fff; box-shadow:0 0 0 3px rgba(40,120,184,.12); }
.auth-form-box .btn-brand { min-height:42px; border:1px solid #1769aa; border-radius:8px; background:#1769aa; box-shadow:0 2px 5px rgba(23,105,170,.12); }
.auth-form-box .btn-brand:hover { background:#12558a; filter:none; }
.auth-form-box .btn-outline-secondary { min-height:40px; }
.auth-back-link, .auth-form-box .btn-link { color:#39749e; font-size:.75rem; }
.auth-form-box .alert { padding:.75rem; font-size:.75rem; line-height:1.6; }
.auth-form-box .errorlist { margin:.4rem 0 0; padding-left:1rem; color:#b93441; font-size:.72rem; }
.auth-form-box .form-text { color:#687c8e; font-size:.71rem; }
.auth-form-box .form-text ul { padding-left:1.1rem; margin:.4rem 0; }
.auth-form-footer { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:.45rem; color:#7d8e9e; font-size:.65rem; }
.auth-form-footer i { color:#5c839f; }
.auth-mobile-brand { display:none; }
.auth-result-icon { display:grid; place-items:center; width:48px; height:48px; margin:0 auto 1.2rem; border-radius:12px; background:#edf5fc; color:#246c9f; font-size:1.2rem; }
.auth-result-icon.is-success { background:#e7f6ef; color:#218260; }
.auth-page .otp-inputs { gap:.45rem; }
.auth-page .auth-form-box .otp-digit { flex:1 1 0; min-width:0; width:0; height:44px; padding:.25rem; font-size:1.1rem; }
.auth-skip-link { position:absolute; top:-100px; left:1rem; z-index:100; padding:.6rem 1rem; border-radius:8px; background:#fff; color:#1769aa; }
.auth-skip-link:focus { top:1rem; }
.auth-page a:focus-visible, .auth-page button:focus-visible { outline:2px solid #448cbe; outline-offset:3px; }
@media (max-width:900px) {
  .auth-shell .auth-side { display:none; }
  .auth-mobile-brand { display:flex; align-items:center; gap:.6rem; color:#203750; font-size:.95rem; font-weight:700; text-decoration:none; }
  .auth-mobile-brand img { width:27px; height:32px; }
}
@media (max-width:480px) {
  .auth-shell .auth-form-side { padding:1.5rem 1rem; gap:1.25rem; }
  .auth-form-box { padding:1.5rem; border-radius:12px; }
  .auth-form-box h3 { font-size:1.0625rem; }
}
