.auth-page{min-height:70vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px 14px 32px;background:linear-gradient(180deg,#fff5fb 0%,#fff 45%,#faf8f9 100%);width:100%;box-sizing:border-box}
.auth-page .auth-card{width:100%;max-width:420px;padding:22px 18px;border-radius:18px;border:1px solid rgba(233,30,99,.12);box-shadow:0 12px 40px rgba(26,18,24,.08)}
.auth-page .auth-card h1{font-size:22px;font-weight:800;margin:0 0 8px;text-align:center;color:#1a1218}
.auth-page .auth-tabs{display:flex;gap:8px;margin-bottom:18px;background:#f5f0f2;padding:4px;border-radius:12px}
.auth-page .auth-tab{flex:1;padding:10px;border:none;border-radius:10px;background:transparent;font-weight:700;font-size:13px;cursor:pointer;color:#6d5f66}
.auth-page .auth-tab.active{background:#fff;color:#c2185b;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.auth-page .form-input{border-radius:12px;padding:12px 14px}
.auth-page .btn-primary{border-radius:12px;padding:12px;font-weight:800}
.auth-back-row{margin-bottom:12px}
.auth-back-btn{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:700;color:#c2185b;text-decoration:none;padding:8px 4px;margin:-4px 0 0 -4px;border-radius:10px}
.auth-back-btn:hover{background:rgba(233,30,99,.08)}
@media (max-width: 767px) {
  .auth-page{align-items:flex-start;padding-top:12px;padding-bottom:calc(24px + env(safe-area-inset-bottom))}
  .auth-page .auth-card{padding:18px 16px;border-radius:16px}
  .auth-page .auth-card h1{font-size:20px}
}
/* auth-mobile-sheet — small smooth “pop” panel */
@keyframes authSheetIn {
  from { opacity: 0; transform: translateY(16px) scale(0.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@media (max-width: 767px) {
  .page-auth .auth-page {
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-end !important;
    padding: 0 12px calc(12px + env(safe-area-inset-bottom)) !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    background: linear-gradient(180deg, rgba(26, 18, 24, 0.35), rgba(26, 18, 24, 0.5)) !important;
  }
  .page-auth .auth-back-row {
    width: 100%;
    max-width: 400px;
    margin: 0 auto 8px;
    padding: 0 4px;
    flex-shrink: 0;
  }
  .page-auth .auth-card {
    width: 100% !important;
    max-width: 400px !important;
    margin: 0 auto !important;
    flex-shrink: 0;
    padding: 20px 18px 22px !important;
    border-radius: 18px 18px 14px 14px !important;
    box-shadow: 0 -8px 40px rgba(26, 18, 24, 0.18) !important;
    animation: authSheetIn 0.38s cubic-bezier(0.22, 1, 0.36, 1) both !important;
    max-height: min(88vh, 640px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }
}

/* v26 — login polish: handle, focus, desktop center */
.page-auth .auth-card {
  position: relative;
}
@media (max-width: 767px) {
  .page-auth .auth-card::before {
    content: '';
    display: block;
    width: 36px;
    height: 4px;
    border-radius: 4px;
    background: rgba(26, 18, 24, 0.12);
    margin: -6px auto 14px;
  }
  .page-auth .auth-card {
    border: 1px solid rgba(255, 255, 255, 0.65);
    background: linear-gradient(180deg, #ffffff 0%, #fffafc 100%);
  }
}
.page-auth .auth-card .form-input:focus {
  border-color: rgba(233, 30, 99, 0.45);
  box-shadow: 0 0 0 3px rgba(233, 30, 99, 0.12);
}
.page-auth .auth-card .btn-primary {
  border-radius: 14px;
  box-shadow: 0 4px 16px rgba(233, 30, 99, 0.25);
}
@media (min-width: 768px) {
  .page-auth .auth-page {
    padding: 24px 16px 40px !important;
  }
  .page-auth .auth-card {
    box-shadow: 0 16px 48px rgba(26, 18, 24, 0.1) !important;
  }
}