/* Opacity keeps report geometry measurable while the opaque loading surface covers it.
   Unlike inherited visibility, it also reveals reliably in WebKit. */
html[data-math-loading] body > :not(#device-agreement):not(#hosted-site-header):not(#hosted-loading):not(#math-view-status):not(iframe[data-math-view]):not(script):not(style) { opacity: 0; pointer-events: none; }
#hosted-loading[hidden] { display: none; }
#hosted-loading {
  position: fixed; inset: 68px 0 0; z-index: 1000; background: #f8faf9;
  display: flex; align-items: center; justify-content: center; flex-direction: column;
  gap: 16px; padding: 24px; box-sizing: border-box; color: #25483b;
  font: 1rem/1.5 system-ui, sans-serif; text-align: center;
}
#hosted-loading p { margin: 0; }
#hosted-loading button { font: inherit; min-height: 44px; padding: 8px 24px; cursor: pointer; }
.hosted-loading-spinner { width: 28px; height: 28px; border: 3px solid #d8e3de; border-top-color: #0d6e4f; border-radius: 50%; animation: hosted-spin 1s linear infinite; }
#hosted-loading[data-state=error] .hosted-loading-spinner { visibility: hidden; }
@keyframes hosted-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .hosted-loading-spinner { animation: none; } }
