/* Meu Conto de Fadas — tema noturno mágico */
html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; background-color: #0e0a2e; }

.font-display { font-family: 'Fredoka', cursive; }

/* Fundo estrelado */
.starfield {
  background:
    radial-gradient(1px 1px at 20% 30%, #fff, transparent),
    radial-gradient(1px 1px at 60% 70%, #fff, transparent),
    radial-gradient(1.5px 1.5px at 80% 20%, #ffe08a, transparent),
    radial-gradient(1px 1px at 40% 80%, #fff, transparent),
    radial-gradient(1.5px 1.5px at 90% 60%, #bcc2ff, transparent),
    radial-gradient(1px 1px at 10% 60%, #fff, transparent),
    radial-gradient(2px 2px at 30% 10%, #ffe08a, transparent);
  background-size: 100% 100%;
}

/* Gradientes */
.bg-night-gradient {
  background: linear-gradient(160deg, #0e0a2e 0%, #1a1547 50%, #2a2370 100%);
}
.bg-magic-gradient {
  background: linear-gradient(135deg, #635be6 0%, #b794f6 50%, #ffd24d 100%);
}
.text-gradient-gold {
  background: linear-gradient(135deg, #ffe08a, #ffd24d, #f5b821);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.text-gradient-magic {
  background: linear-gradient(135deg, #9aa0ff, #b794f6, #ffd24d);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}

/* Glow */
.glow-gold { box-shadow: 0 0 40px -8px rgba(255,210,77,.5); }
.glow-magic { box-shadow: 0 0 50px -10px rgba(99,91,230,.6); }
.text-glow { text-shadow: 0 0 24px rgba(255,210,77,.5); }

/* Cards de vidro */
.glass {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.1);
  backdrop-filter: blur(10px);
}
.card-hover { transition: transform .25s ease, box-shadow .25s ease, border-color .25s; }
.card-hover:hover { transform: translateY(-6px); border-color: rgba(255,210,77,.4); box-shadow: 0 20px 50px -15px rgba(99,91,230,.5); }

/* Blobs */
.blob { position: absolute; border-radius: 50%; filter: blur(80px); opacity: .35; z-index: 0; }

/* Animações */
@keyframes float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-14px)} }
.animate-float { animation: float 5s ease-in-out infinite; }
@keyframes twinkle { 0%,100%{opacity:.3} 50%{opacity:1} }
.twinkle { animation: twinkle 3s ease-in-out infinite; }
@keyframes fadeIn { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:translateY(0)} }
.fade-in { animation: fadeIn .5s ease; }

/* Spinner */
.spinner { border:4px solid rgba(255,255,255,.15); border-top:4px solid #ffd24d; border-radius:50%; width:52px; height:52px; animation:spin 1s linear infinite; }
@keyframes spin { 100%{transform:rotate(360deg)} }

/* Barra de geração */
.progress-track { background: rgba(255,255,255,.1); border-radius: 99px; overflow:hidden; }
.progress-fill { background: linear-gradient(90deg,#635be6,#ffd24d); height:100%; transition: width .4s ease; }

/* Página do livro */
.book-page { background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); }

/* Inputs */
.input-dark {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.15);
  color: #fff;
}
.input-dark::placeholder { color: rgba(255,255,255,.4); }
.input-dark:focus { outline:none; border-color:#ffd24d; box-shadow:0 0 0 3px rgba(255,210,77,.2); }

.no-scrollbar::-webkit-scrollbar { display:none; }
.no-scrollbar { -ms-overflow-style:none; scrollbar-width:none; }

details > summary { list-style: none; }
details > summary::-webkit-details-marker { display:none; }