/* ==========================================================================
   Tela de boot + shell HTML — complemento ao design system (styles.css)
   O design original definia o boot inline (#boot). Aqui ele é extraído para
   uma folha própria para poder ser reutilizado pelo bundle do cliente.
   ========================================================================== */

#boot,
.boot-screen {
  position: fixed;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: var(--bg, #171310);
  z-index: 9999;
  transition: opacity 0.4s ease;
  gap: 24px;
}

#boot.gone { opacity: 0; pointer-events: none; }

.boot-screen {
  background: #171310;
}

.boot-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: 'Fraunces', Georgia, serif;
  color: #ede4d3;
  font-size: 22px;
  font-weight: 500;
}

.boot-logo em {
  color: #dc9a3a;
  font-style: italic;
  font-family: 'Instrument Serif', Georgia, serif;
  font-weight: 400;
}

.boot-logo svg { color: #dc9a3a; }

.boot-progress {
  width: 200px;
  height: 3px;
  background: rgba(220, 154, 58, 0.15);
  border-radius: 999px;
  overflow: hidden;
  position: relative;
}

.boot-progress::before {
  content: '';
  position: absolute;
  height: 100%;
  width: 40%;
  background: linear-gradient(90deg, transparent, #dc9a3a, transparent);
  animation: bootbar 1.2s ease-in-out infinite;
  border-radius: 999px;
}

.boot-hint {
  color: rgba(237, 228, 211, 0.5);
  font-size: 12px;
  font-family: 'DM Sans', system-ui, sans-serif;
  letter-spacing: 0.05em;
  text-align: center;
}

.boot-hint a { color: #dc9a3a; text-decoration: none; }

@keyframes bootbar {
  0% { left: -40%; }
  100% { left: 100%; }
}

/* Fallback quando o JavaScript ainda não executou */
html, body { margin: 0; padding: 0; }
body { background: var(--bg, #171310); }
.noscript-note {
  position: fixed;
  inset: auto 0 24px 0;
  text-align: center;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 13px;
  color: rgba(237, 228, 211, 0.6);
}

/* --------------------------------------------------------------------------
   Logo da NCC no topo do card de login (acima do CTA/eyebrow)
   -------------------------------------------------------------------------- */
.auth-ncc-logo {
  display: flex;
  justify-content: center;
  margin-bottom: var(--sp-2, 8px);
}

.auth-ncc-logo .ncc-logo-wrap { padding: 0; }

@media (max-width: 640px) {
  .auth-ncc-logo .ncc-logo-img { width: 84px; height: 84px; }
}