/* Inter-like system font stack — zero network latency, zero FOUT/CLS */
body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', 'PingFang SC', 'Noto Sans SC', 'Microsoft YaHei', Arial, sans-serif;
}
code, pre, .font-mono {
  font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'Courier New', monospace;
}
/* Initial loader (shown before React mounts) */
.initial-loader {
  position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  background-color: #020617;
  color: #38bdf8; z-index: 9999;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
}
.loader-spinner {
  width: 48px; height: 48px;
  border: 3px solid rgba(56, 189, 248, 0.1);
  border-top-color: #38bdf8;
  border-radius: 50%;
  animation: init-spin 1s linear infinite;
  margin-bottom: 24px;
  box-shadow: 0 0 20px rgba(56, 189, 248, 0.2);
}
.loader-text {
  font-size: 13px; font-weight: 600; letter-spacing: 4px;
  color: #94a3b8; animation: init-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
@keyframes init-spin { to { transform: rotate(360deg); } }
@keyframes init-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .5; } }
@media (prefers-color-scheme: light) {
  .initial-loader { background-color: #f8fafc; color: #0ea5e9; }
  .loader-spinner { border-color: rgba(14, 165, 233, 0.2); border-top-color: #0ea5e9; }
  .loader-text { color: #64748b; }
}