/* Shared by the first HTML paint and the persistent React transition. */
.wa-loading-screen {
  --bs-body-font-family: Poppins, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --wa-text: #202b41; --wa-muted: #6c7587; --wa-bg: #f6f7fb; --wa-card: #fff;
  --wa-line: #e6e8f1; --wa-accent: #6048e8; --wa-track: #eeeafa;
  position: fixed; inset: 0; z-index: 2147483000; display: grid; place-items: center;
  box-sizing: border-box; padding: 24px; overflow: auto; background: var(--wa-bg); color: var(--wa-text);
  font-family: Poppins, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 14px; line-height: 20px;
}
.wa-loading-screen *, .wa-loading-screen *::before, .wa-loading-screen *::after { box-sizing: border-box; }
.wa-loading-group { width: min(100%, 420px); }
.wa-loading-card { width: 100%; padding: 28px; border: 1px solid var(--wa-line); border-radius: 18px; background: var(--wa-card); box-shadow: 0 12px 40px -18px #27334d25, 0 2px 5px #27334d04; }
.wa-loading-eyebrow { margin-bottom: 23px; color: var(--wa-muted); font-size: 12px; font-weight: 500; line-height: 18px; }
.wa-loading-status { display: flex; align-items: center; gap: 16px; min-height: 56px; }
.wa-loading-screen .wa-workspace-avatar { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 54px; height: 54px; padding: 8px; border: 1px solid var(--wa-line); border-radius: 13px; overflow: hidden; font-size: 15px; line-height: 21px; font-weight: 600; color: #6048e8; background: #fff; }
.wa-loading-screen .wa-workspace-avatar img { width: 100%; height: 100%; object-fit: contain; background: transparent; }
.wa-loading-copy { flex: 1; min-width: 0; min-height: 54px; display: flex; flex-direction: column; justify-content: center; gap: 4px; padding: 0; }
.wa-loading-copy .wa-loading-name { display: block; margin: 0; padding: 0; color: var(--wa-text); font-size: 20px; font-weight: 600; line-height: 28px; letter-spacing: -.3px; overflow-wrap: anywhere; }
.wa-loading-copy .wa-loading-detail { display: block; margin: 0; padding: 0; color: var(--wa-muted); font-size: 12px; font-weight: 400; line-height: 18px; }
.wa-loading-progress { margin-top: 28px; height: 3px; overflow: hidden; border-radius: 3px; background: var(--wa-track); }
.wa-loading-progress > span { display: block; width: 40%; height: 100%; border-radius: inherit; background: var(--wa-accent); animation: wa-loading-progress 1.35s ease-in-out infinite; will-change: transform; }
.wa-loading-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 13px; color: var(--wa-muted); font-size: 11px; line-height: 18px; }
.wa-loading-dots { display: inline-flex; gap: 3px; }
.wa-loading-dots i { width: 3px; height: 3px; border-radius: 50%; background: var(--wa-accent); opacity: .45; }
@keyframes wa-loading-progress { 0% { transform: translateX(-105%); } 100% { transform: translateX(355%); } }
.dark-layout .wa-loading-screen, .wa-transition-dark { --wa-text: #e3e7f0; --wa-muted: #a4aec0; --wa-line: #39445b; --wa-bg: #202939; --wa-card: #283247; --wa-accent: #afa0ff; --wa-track: #3d3856; }
.wa-boot-retry { display: block; margin-top: 16px; padding: 0; border: 0; background: transparent; color: var(--wa-text); font: inherit; font-size: 12px; text-decoration: underline; cursor: pointer; }
@media (prefers-reduced-motion: reduce) { .wa-loading-progress > span { animation: none; transform: translateX(75%); opacity: .65; } }
@media (max-width: 420px) { .wa-loading-card { padding: 24px; } .wa-loading-copy .wa-loading-name { font-size: 18px; } }

.wa-loading-platform-brand { position: absolute; top: 24px; left: 24px; display: flex; align-items: center; }
.wa-loading-platform-brand img { display: block; width: 180px; height: auto; }
@media (max-width: 420px) { .wa-loading-platform-brand { top: 20px; left: 20px; } }
