:root{
  --roxo:#8B5CF6; --violeta:#4C1D95; --dourado:#D4A24E;
  --cosmico:#0D0A14; --lunar:#F5F3FF; --lavanda:#C4B5FD;
  --display:'Cormorant Garamond',serif; --corpo:'Sora',sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--corpo);background:var(--cosmico);color:var(--lunar);min-height:100dvh;line-height:1.6}
#ceu{position:fixed;inset:0;z-index:0;pointer-events:none}

.topo{
  position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;
  padding:1rem 1.4rem;border-bottom:1px solid rgba(139,92,246,.18);
  background:rgba(13,10,20,.6);backdrop-filter:blur(8px);
}
.voltar{color:var(--lavanda);text-decoration:none;font-size:.9rem}
.voltar:hover{color:var(--dourado)}
.marca{font-family:var(--display);font-size:1.2rem}
.marca em{font-style:normal;color:var(--roxo);font-weight:700;text-shadow:0 0 10px rgba(139,92,246,.6)}
.usuario{font-size:.8rem;color:var(--lavanda);text-transform:capitalize;opacity:.8}

.numero{position:relative;z-index:1;max-width:680px;margin:0 auto;padding:2rem 1.4rem 4rem}
.bloco{
  background:rgba(26,21,37,.6);border:1px solid rgba(139,92,246,.2);
  border-radius:18px;padding:2rem;margin-bottom:1.4rem;backdrop-filter:blur(6px);
}
.centro{text-align:center;padding:3rem 1rem;color:var(--lavanda)}
.lua-girando{font-size:2.5rem;display:inline-block;animation:girar 3s linear infinite}
@keyframes girar{to{transform:rotate(360deg)}}

.titulo{font-family:var(--display);font-size:clamp(1.8rem,5vw,2.4rem);font-weight:500;margin-bottom:1rem;text-align:center}
.intro-texto{color:var(--lunar);margin-bottom:1.4rem;line-height:1.7}

.campo-rotulo{display:block;font-size:.85rem;color:var(--lavanda);margin-bottom:.4rem;margin-top:1rem}
.campo{
  width:100%;background:rgba(13,10,20,.5);border:1px solid rgba(139,92,246,.25);border-radius:12px;
  padding:.85rem;color:var(--lunar);font-family:var(--corpo);font-size:1rem;
}
.campo:focus{outline:none;border-color:var(--roxo)}
.dica{font-size:.8rem;color:var(--lavanda);opacity:.75;margin-top:.4rem}

.botao{
  padding:.85rem 1.6rem;border-radius:999px;border:none;cursor:pointer;
  font-family:var(--corpo);font-size:1rem;font-weight:600;text-decoration:none;display:inline-block;text-align:center;margin-top:1.4rem;
}
.botao-primario{background:linear-gradient(135deg,var(--roxo),var(--violeta));color:var(--lunar);box-shadow:0 4px 20px rgba(139,92,246,.3);width:100%}
.botao-primario:hover{transform:translateY(-1px)}
.botao-secundario{background:rgba(139,92,246,.12);color:var(--lavanda);border:1px solid rgba(139,92,246,.3)}

/* grade de números */
.numeros-grade{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-bottom:1.6rem}
.numero-card{
  text-align:center;padding:1.4rem .8rem;background:rgba(139,92,246,.1);
  border:1px solid rgba(139,92,246,.25);border-radius:14px;
}
.numero-valor{
  font-family:var(--display);font-size:2.6rem;font-weight:600;color:var(--dourado);
  display:block;line-height:1;margin-bottom:.4rem;text-shadow:0 0 16px rgba(212,162,78,.4);
}
.numero-rotulo{font-size:.8rem;color:var(--lavanda);text-transform:uppercase;letter-spacing:.05em}

.interpretacao{line-height:1.8;color:var(--lunar)}
.interpretacao p{margin-bottom:1rem}
.interpretacao .subtitulo{
  font-family:var(--display);font-size:1.3rem;color:var(--dourado);
  margin:1.4rem 0 .4rem;font-weight:600;
}

.premium-cta{
  margin-top:1.6rem;padding:1.4rem;background:rgba(212,162,78,.08);border:1px solid rgba(212,162,78,.3);
  border-radius:14px;text-align:center;
}
.premium-cta p{color:var(--lavanda);margin-bottom:1rem;line-height:1.6}
.premium-cta .botao{margin-top:0}
.acoes-resultado{margin-top:1.6rem;text-align:center}
.acoes-resultado .botao{margin-top:0}

@media (max-width:560px){
  .bloco{padding:1.4rem}
  .numeros-grade{grid-template-columns:1fr}
}