.loading-overlay{
  position:fixed;
  inset:0;
  z-index:1000;
  display:grid;
  place-items:center;
  padding:24px;
  background:rgba(30,41,59,.32);
  -webkit-backdrop-filter:blur(3px);
  backdrop-filter:blur(3px);
  animation:loading-overlay-in .18s ease-out both;
}
.loading-overlay[hidden]{display:none}
.loading-dialog{
  width:min(360px,calc(100vw - 40px));
  padding:28px 30px 24px;
  border:1px solid rgba(219,229,243,.96);
  border-radius:16px;
  background:rgba(255,255,255,.98);
  box-shadow:0 22px 60px rgba(28,48,80,.22);
  text-align:center;
  animation:loading-dialog-in .24s ease-out both;
}
.database-loader{
  position:relative;
  display:grid;
  place-items:center;
  width:70px;
  height:70px;
  margin:0 auto 18px;
  border-radius:20px;
  color:#3478ed;
  background:#edf4ff;
  border:1px solid #dce9fd;
}
.database-loader svg{width:44px;height:44px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.database-loader span{
  position:absolute;
  right:8px;
  bottom:8px;
  width:11px;
  height:11px;
  border:3px solid #fff;
  border-radius:50%;
  background:#23a98c;
  box-sizing:content-box;
  animation:database-pulse 1.25s ease-in-out infinite;
}
.loading-copy strong{display:block;color:#2e4260;font-size:17px;font-weight:650;letter-spacing:.1px}
.loading-copy p{margin:8px 0 18px;color:#71839d;font-size:12px;line-height:1.7}
.loading-progress{height:4px;overflow:hidden;border-radius:999px;background:#e9eff8}
.loading-progress span{display:block;width:42%;height:100%;border-radius:inherit;background:#3478ed;animation:database-progress 1.15s ease-in-out infinite}
.loading-dialog>small{display:block;margin-top:13px;color:#8c9aaf;font-size:10px;line-height:1.6}
body.loading{overflow:hidden}
@keyframes loading-overlay-in{from{opacity:0}to{opacity:1}}
@keyframes loading-dialog-in{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}
@keyframes database-progress{0%{transform:translateX(-105%)}50%{transform:translateX(70%)}100%{transform:translateX(240%)}}
@keyframes database-pulse{0%,100%{transform:scale(.82);opacity:.72}50%{transform:scale(1);opacity:1}}
@media(max-width:700px){.loading-dialog{padding:24px 22px 21px}.database-loader{width:62px;height:62px;border-radius:17px}.database-loader svg{width:39px;height:39px}}
@media(prefers-reduced-motion:reduce){.loading-overlay,.loading-dialog,.database-loader span,.loading-progress span{animation:none}.loading-progress span{width:100%;opacity:.72}}