/* Browser adapter for the shared Angular busy indicator. Image owns its animation. */
.tru-busy-overlay {
  position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none;
  margin: 0; padding: 1rem; box-sizing: border-box; border: 0; background: transparent;
  color: var(--fg); outline: 0; overflow: hidden; overscroll-behavior: contain; touch-action: none;
}
.tru-busy-overlay[open] { display: grid; place-items: center; }
.tru-busy-overlay::backdrop { background: var(--flow-modal-backdrop, rgb(0 0 0 / 35%)); -webkit-backdrop-filter: blur(var(--flow-modal-blur, 6px)); backdrop-filter: blur(var(--flow-modal-blur, 6px)); }
.tru-busy-status { display: grid; max-width: 100%; justify-items: center; gap: .5rem; padding: 0; background: transparent; }
.tru-busy-status img { display: block; width: min(27rem, 90.75vw); max-width: 100%; max-height: calc(100dvh - 2rem); height: auto; object-fit: contain; }
.tru-busy-status span { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
[data-flow-background='ink'] .tru-busy-status img, [data-flow-background='red'] .tru-busy-status img, [data-flow-background='green'] .tru-busy-status img,
[data-learn-background='ink'] .tru-busy-status img, [data-learn-background='red'] .tru-busy-status img, [data-learn-background='green'] .tru-busy-status img { filter: invert(1); }
.tru-data-grid .grid-empty { margin-block: 1rem; }
.tru-data-grid button { margin: 0; }