/* Pinned Plane 1.4.3 SPA shell and LogoSpinner. Loaded by native root.links as
   well as the static HTML, so the same sphere appears before and after mount. */
:root { --bureau-loader-bg: #080a10; }
html[data-theme='light'], html[data-bureau-theme='light'] { --bureau-loader-bg: #f8f9fb; }

.bureau-initial-loader {
  display: flex;
  min-height: 100vh;
  min-height: 100dvh;
  width: 100%;
  align-items: center;
  justify-content: center;
  background: var(--bureau-loader-bg);
}

/* Both upstream LogoSpinner implementations render precisely this direct img.
   Keep the native loaded state and lifecycle; replace only its decoration. */
.flex.items-center.justify-center:has(> img[alt='logo'][src*='/logo-spinner-dark-']),
.flex.items-center.justify-center:has(> img[alt='logo'][src*='/logo-spinner-light-']),
.bureau-initial-sphere {
  position: relative;
  display: block;
  flex: 0 0 64px;
  width: 64px;
  height: 64px;
}
.flex.items-center.justify-center > img[alt='logo'][src*='/logo-spinner-dark-'],
.flex.items-center.justify-center > img[alt='logo'][src*='/logo-spinner-light-'] {
  visibility: hidden;
  width: 64px;
  height: 64px;
}
.flex.items-center.justify-center:has(> img[alt='logo'][src*='/logo-spinner-dark-'])::before,
.flex.items-center.justify-center:has(> img[alt='logo'][src*='/logo-spinner-light-'])::before,
.bureau-initial-sphere::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('/bureau/favicon.svg?v=7') center / contain no-repeat;
  animation: bureau-sphere-breathe 2.8s ease-in-out infinite;
}
.relative.flex.h-screen.w-full.items-center.justify-center:has(img[alt='logo'][src*='/logo-spinner-']) {
  background: var(--bureau-loader-bg);
}
@keyframes bureau-sphere-breathe {
  0%, 100% { transform: scale(.94); opacity: .82; }
  50% { transform: scale(1); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .flex.items-center.justify-center:has(> img[alt='logo'][src*='/logo-spinner-'])::before,
  .bureau-initial-sphere::before { animation: none; }
}