html, body { background: #F2F3F5; margin: 0; font-family: system-ui, -apple-system, "Segoe UI", Inter, sans-serif; }
html:where(.site-dark), :where(html.site-dark) body { background: #0F1014; }
#app-loader {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 24px;
  background: #F2F3F5;
  color: #15161C;
  transition: opacity .2s cubic-bezier(.23,1,.32,1);
}
html.site-dark #app-loader { background: #0F1014; color: #ECEDF1; }
#app-loader.app-loader--hide { opacity: 0; pointer-events: none; }
.app-loader__brand {
  display: flex; align-items: center; gap: 12px;
  font-weight: 700; font-size: 22px; letter-spacing: .06em; text-transform: uppercase;
}
.app-loader__brand svg { width: 36px; height: 36px; }
.app-loader__brand .ldr-new { width: 60px; height: 30px; }
.app-loader__brand .ldr-old { display: none; }
.ldr-tile { fill: #15161C; }
.ldr-bar { fill: #fff; }
html.site-dark .ldr-tile { fill: #fff; }
html.site-dark .ldr-bar { fill: #15161C; }
.app-spinner {
  width: 36px; height: 36px;
  border: 3px solid rgba(21,22,28,.14);
  border-top-color: #15161C;
  border-radius: 50%;
  animation: app-spinner-rotate .75s linear infinite;
}
html.site-dark .app-spinner { border-color: rgba(255,255,255,.18); border-top-color: #fff; }
@keyframes app-spinner-rotate { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { #app-loader { transition: none; } .app-spinner { animation-duration: 1.5s; } }