/* A themed canvas is available before either app's full stylesheet paints. */
html {
  background-color: #101014;
  color-scheme: dark;
}
html[data-theme="light"] {
  background-color: #f5f3f7;
  color-scheme: light;
}
html[data-app="dashboard"] {
  background-color: #111114;
}
html[data-app="dashboard"][data-theme="light"] {
  background-color: #f7f6f9;
}

/* Same-origin navigation keeps the old page visible under the incoming page. */
@view-transition {
  navigation: auto;
}
::view-transition-old(root) {
  animation: none;
  mix-blend-mode: normal;
}
::view-transition-new(root) {
  animation: noemad-page-arrive 160ms ease-out both;
  mix-blend-mode: normal;
}
@keyframes noemad-page-arrive {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.motion-paused::view-transition-old(root),
.motion-paused::view-transition-new(root) {
  animation: none;
}
@media (prefers-reduced-motion: reduce) {
  @view-transition {
    navigation: none;
  }
  ::view-transition-old(root),
  ::view-transition-new(root) {
    animation: none;
  }
}

.dashboard-boot {
  min-height: 100dvh;
  display: grid;
  place-content: center;
  gap: 20px;
  margin: 0;
  color: #a19da9;
  font:
    14px/1.5 "Funnel Sans",
    sans-serif;
  text-align: center;
}
.dashboard-boot img {
  margin: auto;
}
.dashboard-boot h1 {
  margin: 0;
  font: inherit;
}
[data-theme="light"] .dashboard-boot {
  color: #6c6675;
}
[data-theme="light"] .dashboard-boot img {
  filter: brightness(0.66) saturate(1.2);
}

/* Preserve element sizes and grain; defer only the decorative artwork layers. */
.lazy-media .noema-greek-art[data-lazy-art]:not([data-art-ready]),
.lazy-media .noema-step-visual[data-lazy-art]:not([data-art-ready])::before,
.lazy-media .noema-usecase-art[data-lazy-art]:not([data-art-ready])::before,
.lazy-media .noema-routing[data-lazy-art]:not([data-art-ready])::before {
  background-image: none !important;
}