/* ─── Page Loader ─────────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
  #nd-loader { display: none !important; }
}

#nd-loader {
  position: fixed; inset: 0; z-index: 9999;
  background: #0a0a0a;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 20px;
}

.loader-avatar {
  width: 48px; height: 48px; border-radius: 50%;
  background: #222222;
  border: 0.5px solid rgba(201,169,110,0.3);
  color: #c9a96e;
  font-family: 'Geist Mono', monospace;
  font-size: 14px; font-weight: 500;
  display: flex; align-items: center; justify-content: center;
  animation:
    loaderAvatarPulse 2.4s ease-in-out infinite,
    loaderFadeIn 0.3s ease forwards;
}

.loader-bubble {
  width: 280px;
  background: #111111;
  border: 0.5px solid rgba(255,255,255,0.08);
  border-radius: 4px 12px 12px 12px;
  padding: 16px 18px;
  animation: loaderFadeIn 0.3s ease forwards;
}

.loader-rows {
  display: flex; flex-direction: column; gap: 8px;
}

.loader-row {
  height: 10px; border-radius: 3px;
  background: rgba(255,255,255,0.06);
  position: relative; overflow: hidden;
}

.loader-row::after {
  content: '';
  position: absolute; top: 0; left: -100%;
  height: 100%;
  background: rgba(201,169,110,0.18);
  border-radius: 3px;
  animation: loaderRowFill 0.5s ease forwards;
}

.loader-row:nth-child(1)::after { width: 75%; animation-delay: 0.3s; }
.loader-row:nth-child(2)::after { width: 90%; animation-delay: 0.5s; }
.loader-row:nth-child(3)::after { width: 55%; animation-delay: 0.7s; }

.loader-phase {
  font-family: 'Geist Mono', monospace;
  font-size: 10px;
  color: rgba(85,82,80,0.8);
  margin-top: 10px;
  opacity: 0;
  animation: loaderPhase 0.8s ease forwards;
  animation-delay: 0.3s;
}

.loader-reveal {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-size: 18px;
  color: rgba(201,169,110,0.9);
  opacity: 0;
  animation: loaderReveal 0.35s ease forwards;
  animation-delay: 1.2s;
}

.loader-bottom {
  display: flex; align-items: center; gap: 8px;
  opacity: 0;
  animation: loaderFadeIn 0.2s ease forwards;
  animation-delay: 1.55s;
}

.loader-cursor {
  width: 2px; height: 16px;
  background: #c9a96e; border-radius: 1px;
  animation: loaderBlink 0.85s ease-in-out infinite;
}

.loader-domain {
  font-family: 'Geist Mono', monospace;
  font-size: 11px;
  color: rgba(136,133,128,0.5);
}

/* ─── Keyframes ──────────────────────────────────────────── */

@keyframes loaderFadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes loaderAvatarPulse {
  0%, 100% { border-color: rgba(201,169,110,0.3); }
  50%       { border-color: rgba(201,169,110,0.8); }
}

@keyframes loaderRowFill {
  from { left: -100%; }
  to   { left: 0%; }
}

@keyframes loaderPhase {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes loaderReveal {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes loaderBlink {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0; }
}
