/* Pre-React loading spinner styles.
   Kept in /public (copied verbatim, not transformed by Vite) so index.html
   has no inline <style> — this avoids the intermittent vite:html-inline-proxy
   build error ("No matching HTML proxy module found"). Loaded render-blocking
   from <head> so the loader paints instantly. */
html,
body {
  background-color: #0a0a0c;
  color: #f4f4f5;
  margin: 0;
}

/* Vendor light mode. The class is set by the inline script in index.html before
   first paint; this file is render-blocking and index.css only arrives with the
   JS bundle, so without these rules a light-mode vendor stares at a dark screen
   for the whole spinner. Values mirror `.theme-light .vendor-theme` in
   src/index.css — keep them in step. */
html.theme-light,
html.theme-light body {
  background-color: #f7f7f8;
  color: #18181b;
}

#app-loading {
  min-height: 100vh;
  display: grid;
  place-items: center;
  opacity: 0;
  animation: show-loader 0.2s ease forwards;
  animation-delay: 0.35s;
}

#app-loading .spinner {
  width: 26px;
  height: 26px;
  border-radius: 999px;
  border: 2px solid #27272a;
  border-top-color: #60a5fa;
  animation: spin 0.8s linear infinite;
}

html.theme-light #app-loading .spinner {
  border-color: #e4e4e8;
  border-top-color: #7c3aed;
}

@keyframes show-loader {
  to {
    opacity: 1;
  }
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
