/* Loaded with the document so refreshes have feedback before React arrives. */
.tv-page-loader {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.1rem;
  width: 100%;
  min-width: 0;
  min-height: 16rem;
  padding: 2rem 1rem;
  color: var(--ten-text-muted, #625c66);
  font-family: var(--font-brand-ui, 'Work Sans', sans-serif);
  text-align: center;
}
.tv-page-loader--screen {
  min-height: 100vh;
  min-height: 100dvh;
  background: var(--ten-background, #f5f4f0);
}
.tv-page-loader--compact { min-height: 0; padding: 1.25rem 1rem; }
.tv-page-loader__spinner {
  box-sizing: border-box;
  flex: 0 0 auto;
  width: 2.5rem;
  height: 2.5rem;
  border: 3px solid var(--ten-border-subtle, #d9d3dc);
  border-top-color: var(--ten-link, #321b45);
  border-radius: 50%;
  animation: tv-page-loader-spin 850ms linear infinite;
}
.tv-page-loader .tv-page-loader__message {
  max-width: 28ch;
  min-height: 3em;
  margin: 0;
  color: inherit;
  font-size: .875rem;
  font-weight: 500;
  line-height: 1.5;
  text-wrap: balance;
}
.tv-page-loader__accessible {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
:root[data-theme='dark'] .tv-page-loader {
  color: var(--ten-text-muted, #c9c1ce);
}
:root[data-theme='dark'] .tv-page-loader--screen { background: var(--ten-background, #1e1e1e); }
:root[data-theme='dark'] .tv-page-loader__spinner {
  border-color: var(--ten-border-subtle, #655a6c);
  border-top-color: var(--ten-link, #c6bbcf);
}
.splash .tv-page-loader { color: #c9c1ce; }
.splash .tv-page-loader__spinner { border-color: #655a6c; border-top-color: #c6bbcf; }
@keyframes tv-page-loader-spin { to { transform: rotate(360deg); } }
:root[data-motion='reduce'] .tv-page-loader__spinner { animation: none; }
@media (prefers-reduced-motion: reduce) {
  :root:not([data-motion='allow']) .tv-page-loader__spinner { animation: none; }
}
@media (forced-colors: active) {
  .tv-page-loader .tv-page-loader__spinner { border-color: GrayText; border-top-color: Highlight; }
}