#nn-loader {

  position: fixed; inset: 0; z-index: 99999;

  background: #00000e;

  display: flex; flex-direction: column;

  align-items: center; justify-content: center;

  gap: 24px;

  transition: opacity 0.6s ease, visibility 0.6s ease;

}

#nn-loader.nn-hide {

  opacity: 0; visibility: hidden;

  pointer-events: none;

}

#nn-loader .nn-logo-wrap {

  width: clamp(80px, 15vw, 140px);

  height: clamp(80px, 15vw, 140px);

}

#nn-loader .nn-logo-wrap svg {

  width: 100%; height: 100%;

}

/* Stroke draw-in animation for each path */

#nn-loader .nn-path {

  stroke-dasharray: 2000;

  stroke-dashoffset: 2000;

  fill: transparent;

  animation: nn-draw 1.8s ease forwards, nn-fill 0.5s ease 1.8s forwards;

}

#nn-loader .nn-path-2 {

  animation-delay: 0.3s, 2.1s;

}

#nn-loader .nn-path-3 {

  animation-delay: 0.6s, 2.4s;

}

@keyframes nn-draw {

  to { stroke-dashoffset: 0; }

}

@keyframes nn-fill {

  to { fill: #c91f4c; fill-opacity: 1; }

}

/* Loading text */

#nn-loader .nn-loading-text {

  color: #666;

  font-family: 'Inter', system-ui, sans-serif;

  font-size: 0.75rem;

  letter-spacing: 0.3em;

  text-transform: uppercase;

  opacity: 0;

  animation: nn-fade-in 0.5s ease 0.8s forwards;

}

@keyframes nn-fade-in {

  to { opacity: 1; }

}

/* Loading bar */

#nn-loader .nn-loading-bar {

  width: 120px; height: 2px;

  background: rgba(201, 31, 76, 0.2);

  border-radius: 1px;

  overflow: hidden;

  opacity: 0;

  animation: nn-fade-in 0.5s ease 1s forwards;

}

#nn-loader .nn-loading-bar::after {

  content: '';

  display: block;

  width: 40%; height: 100%;

  background: #c91f4c;

  border-radius: 1px;

  animation: nn-slide 1.2s ease-in-out infinite;

}

@keyframes nn-slide {

  0% { transform: translateX(-100%); }

  100% { transform: translateX(350%); }

}

/* Prevent body scroll while loading */

body.nn-loading { overflow: hidden; }

/* Uploaded SVG logos and the default drawn mark share one seamless, GPU-friendly loop. */
#nn-loader .nn-logo-wrap{animation:nn-breathe 2.8s ease-in-out infinite;will-change:transform,opacity}
#nn-loader .nn-logo-wrap img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 16px #c91f4c40)}
#nn-loader .nn-path{animation:nn-stroke-loop 3.2s ease-in-out infinite;fill:#c91f4c}
#nn-loader .nn-path-2{animation-delay:.12s}
#nn-loader .nn-path-3{animation-delay:.24s}
@keyframes nn-breathe{0%,100%{transform:translateY(0) scale(.96);opacity:.78}50%{transform:translateY(-4px) scale(1.025);opacity:1}}
@keyframes nn-stroke-loop{0%,100%{stroke-dashoffset:2000;fill-opacity:0}40%{stroke-dashoffset:0;fill-opacity:0}62%,82%{stroke-dashoffset:0;fill-opacity:1}}
@media(prefers-reduced-motion:reduce){#nn-loader .nn-logo-wrap,#nn-loader .nn-path{animation:none;transform:none;opacity:1;stroke-dashoffset:0;fill-opacity:1}}