tableau-viz { position: relative; }
tableau-viz::before,
tableau-viz::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 9998;
  opacity: 1;
  pointer-events: auto;
  transition: opacity 150ms ease;
}
tableau-viz::before {
  background: rgba(240,240,240,1.0);
}
tableau-viz::after {
  content: "";
  position: absolute;
  z-index: 9999;
  /* top: 50%; */
  top:11%;
  left: 48%;
  width: 60px;
  height: 60px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  border: 6px solid #c9ccd1;
  border-top-color: #2a2f36;
  animation: tbl-spin 0.9s linear infinite;
  opacity: 1;
  pointer-events: none;
  transition: opacity 150ms ease;
}
@keyframes tbl-spin {
  to { transform: translate(-50%, -50%) rotate(360deg); }
}

/* Overlay OFF when .tableau-ready is on HTML OR BODY (higher specificity + !important) */
:is(html, body).tableau-ready tableau-viz::before,
:is(html, body).tableau-ready tableau-viz::after {
  opacity: 0 !important;
  pointer-events: none !important;
}