/* UI theme v3 — sign-in panel (v4, 2026-09-23). Linked on every login page
   after /popup-theme.css. Clear glass: a faint sky-blue tint (the scene shows
   through), a light-blue border, a mild blur so the moon, hills and towers
   behind the panel stay recognisable. */
.auth-panel {
  border: 1.5px solid rgba(147, 197, 253, .50) !important;
  background: linear-gradient(160deg, rgba(56, 189, 248, .11) 0%, rgba(37, 99, 235, .07) 45%, rgba(14, 165, 233, .03) 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 0 0 1px rgba(56, 189, 248, .08), 0 24px 70px rgba(2, 132, 199, .22), 0 0 100px rgba(125, 211, 252, .12) !important;
  backdrop-filter: blur(6px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(6px) saturate(125%) !important;
}
.auth-panel .otp-box, .auth-panel .error-box { border-radius: 14px; }

/* Phone: the panel loses its box (as the base auth-style already intends —
   the !important rules above would otherwise bring the frame back). */
@media (max-width: 576px) {
  .auth-panel {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}
