/* Numerologia Apps — estilos autónomos (prefijo .napp), pensados para convivir
   con cualquier tema y con tarot-apps (.tapp), oraculo-apps (.oapp) y
   mancia-apps (.mapp). Todo fluido: ninguna medida fija de escena. */

/* El width: 100 % no sobra. Si el tema mete la app dentro de un contenedor
   flex o grid, sin él la caja se mide por su contenido y las rejillas de los
   formularios la estiran por encima de la pantalla en móvil. */
.napp { width: 100%; max-width: 820px; margin: 0 auto; font-size: 1rem; }
.napp * { box-sizing: border-box; }
.napp [hidden] { display: none !important; }

.napp .napp-intro {
  margin: 0;
  font-size: clamp(.95rem, 2.7vw, 1.08rem);
  line-height: 1.5;
  max-width: 40rem;
}

.napp .napp-btn {
  display: inline-block;
  border: 0;
  cursor: pointer;
  font: inherit;
  font-weight: 700;
  color: #1a1030;
  padding: .62rem 1.4rem;
  border-radius: 999px;
  background: linear-gradient(180deg, #ffd86b, #f0ab1e);
  box-shadow: 0 3px 10px rgba(0, 0, 0, .35);
  transition: transform .12s ease, filter .12s ease;
}
.napp .napp-btn:hover { filter: brightness(1.07); }
.napp .napp-btn:active { transform: translateY(1px); }
.napp .napp-btn:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.napp button { -webkit-tap-highlight-color: transparent; }
.napp button:focus { outline: none; }
.napp button:focus-visible { outline: 2px solid #ffd76b; outline-offset: 3px; }

/* ── Calculadora numerológica ───────────────────────────────────── */
.napp .napp-ca {
  position: relative;
  border-radius: 14px;
  padding: 1.4rem 1.2rem 1.7rem;
  background:
    radial-gradient(1px 1px at 15% 20%, rgba(255, 255, 255, .7), rgba(255, 255, 255, 0)),
    radial-gradient(1px 1px at 82% 14%, rgba(255, 255, 255, .6), rgba(255, 255, 255, 0)),
    radial-gradient(1px 1px at 70% 76%, rgba(255, 255, 255, .5), rgba(255, 255, 255, 0)),
    radial-gradient(ellipse at 50% 0%, #2c1b64 0%, #1a1140 48%, #0b0720 100%);
  color: #efe9ff;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.1rem;
  text-align: center;
}
.napp .napp-ca .napp-intro { color: #d9cfff; }

.napp .napp-ca-form { width: 100%; max-width: 34rem; display: flex; flex-direction: column; align-items: center; gap: .8rem; }
.napp .napp-ca-campo { position: relative; width: 100%; display: block; }
.napp .napp-ca-input {
  width: 100%;
  padding: .7rem 3.4rem .7rem 1rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .45);
  background: rgba(0, 0, 0, .4);
  color: #fff;
  font: inherit;
  font-size: 1.05rem;
  text-align: center;
}
.napp .napp-ca-input::placeholder { color: rgba(255, 255, 255, .6); }
.napp .napp-ca-input:focus-visible { outline: 2px solid #ffd76b; outline-offset: 2px; }
.napp .napp-ca-restantes {
  position: absolute;
  right: .9rem;
  top: 50%;
  translate: 0 -50%;
  font-size: .8rem;
  color: #b7a8ea;
  font-variant-numeric: tabular-nums;
}

.napp .napp-ca-alfabetos {
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 12px;
  padding: .6rem .9rem .8rem;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 1.1rem;
  align-items: center;
  justify-content: center;
}
.napp .napp-ca-alfabetos legend { padding: 0 .4rem; font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: #b7a8ea; }
.napp .napp-ca-alfabetos label { display: inline-flex; align-items: center; gap: .35rem; cursor: pointer; font-size: .95rem; }
.napp .napp-ca-tabla-btn {
  font: inherit;
  font-size: .82rem;
  cursor: pointer;
  color: #ffd86b;
  background: none;
  border: 1px solid rgba(255, 216, 107, .5);
  border-radius: 999px;
  padding: .18rem .7rem;
}
.napp .napp-ca-pie { margin: 0; font-size: .8rem; color: #a89ad8; }
.napp .napp-ca-err {
  margin: 0;
  background: rgba(150, 10, 10, .82);
  color: #fff;
  font-weight: 700;
  padding: .5rem .9rem;
  border-radius: 8px;
}

/* La tabla del alfabeto: 9 columnas de valores */
.napp .napp-ca-tabla { width: 100%; max-width: 34rem; overflow-x: auto; }
.napp .napp-ca-tabla table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.napp .napp-ca-tabla th, .napp .napp-ca-tabla td {
  border: 1px solid rgba(255, 255, 255, .16);
  padding: .3rem .2rem;
  text-align: center;
}
.napp .napp-ca-tabla th { background: rgba(255, 216, 107, .16); color: #ffd86b; font-variant-numeric: tabular-nums; }

/* Resultado */
.napp .napp-ca-resultado {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.1rem;
  animation: napp-entra .4s ease both;
}
@keyframes napp-entra {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: none; }
}
/* Las cifras del legacy son casi negras: se les pone un halo detrás para que
   destaquen sobre el fondo oscuro de la escena. */
.napp .napp-ca-cifra {
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .3rem;
  position: relative;
  padding: .6rem 1.6rem;
}
.napp .napp-ca-cifra::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -60%;
  width: clamp(9rem, 38vw, 14rem);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(150, 120, 255, .5) 0%, rgba(90, 200, 255, .22) 42%, rgba(0, 0, 0, 0) 68%);
  pointer-events: none;
}
.napp .napp-ca-img {
  position: relative;
  width: clamp(7rem, 30vw, 11rem);
  height: auto;
  filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .6)) drop-shadow(0 0 3px rgba(255, 255, 255, .35));
}
.napp .napp-ca-titulo {
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.1rem, 4vw, 1.4rem);
  color: #ffd86b;
  letter-spacing: .02em;
}

.napp .napp-ca-desglose, .napp .napp-ca-textos, .napp .napp-ca-corresp {
  width: 100%;
  max-width: 40rem;
  background: rgba(0, 0, 0, .3);
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 12px;
  padding: .9rem 1rem 1rem;
  text-align: left;
}
.napp .napp-ca h4 {
  margin: 0 0 .35rem;
  font-size: .76rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #b7a8ea;
  font-weight: 700;
}
.napp .napp-ca-textos h4 { margin-top: .9rem; }
.napp .napp-ca-textos h4:first-child { margin-top: 0; }
.napp .napp-ca p { margin: 0; line-height: 1.55; }
.napp .napp-ca-caras { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(14rem, 100%), 1fr)); gap: .9rem 1.4rem; margin-top: .9rem; }
.napp .napp-ca-caras h4 { margin-top: 0; }
.napp .napp-ca-pos { color: #c8ffd8; }
.napp .napp-ca-neg { color: #ffd2d2; }

/* El desglose letra a letra */
.napp .napp-ca-letras { line-height: 2.1; }
.napp .napp-ca-letra {
  display: inline-block;
  margin: 0 .18rem .25rem 0;
  padding: .1rem .4rem;
  border-radius: 6px;
  background: rgba(255, 255, 255, .07);
  font-variant-numeric: tabular-nums;
}
.napp .napp-ca-letra b { color: #ffd86b; font-size: 1.05rem; }
.napp .napp-ca-letra i { font-style: normal; color: #8fe7ff; font-size: .8rem; }
.napp .napp-ca-pasos { margin-top: .5rem; font-size: 1.05rem; font-variant-numeric: tabular-nums; color: #efe9ff; }
.napp .napp-ca-pasos b { color: #7dffa6; font-size: 1.2rem; }
.napp .napp-ca-pasos .napp-ca-flecha { color: #b7a8ea; padding: 0 .35rem; }
.napp .napp-ca-maestro { color: #ffd86b; font-weight: 700; }

/* Las correspondencias, en dos columnas */
.napp .napp-ca-lista {
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(13rem, 100%), 1fr));
  gap: .3rem 1.4rem;
}
.napp .napp-ca-lista div {
  display: flex;
  justify-content: space-between;
  gap: .8rem;
  padding: .28rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  font-size: .92rem;
}
.napp .napp-ca-lista dt { color: #a89ad8; }
.napp .napp-ca-lista dd { margin: 0; text-align: right; }

/* ── Numerología completa: cuatro lecturas ──────────────────────── */
.napp .napp-co {
  position: relative;
  border-radius: 14px;
  padding: 1.4rem 1.2rem 1.7rem;
  background:
    radial-gradient(1px 1px at 18% 12%, rgba(255, 255, 255, .7), rgba(255, 255, 255, 0)),
    radial-gradient(1px 1px at 76% 22%, rgba(255, 255, 255, .55), rgba(255, 255, 255, 0)),
    radial-gradient(ellipse at 50% 0%, #123b5e 0%, #0e2340 48%, #060d1c 100%);
  color: #e7f2ff;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.2rem;
  text-align: center;
}
.napp .napp-co .napp-intro { color: #c8ddf3; }

.napp .napp-co-form {
  width: 100%;
  max-width: 34rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(13rem, 100%), 1fr));
  gap: .7rem 1rem;
  text-align: left;
}
.napp .napp-co-campo { display: flex; flex-direction: column; gap: .25rem; }
.napp .napp-co-campo span { font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; color: #92b6d8; }
.napp .napp-co-campo input {
  width: 100%;
  padding: .55rem .85rem;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, .38);
  background: rgba(0, 0, 0, .38);
  color: #fff;
  font: inherit;
}
.napp .napp-co-campo input:focus-visible { outline: 2px solid #ffd76b; outline-offset: 2px; }
/* El icono del calendario lo pinta el navegador, y sobre estas escenas oscuras
   salía casi negro. El color-scheme: dark hace que lo dibuje en blanco —y que
   el desplegable del calendario venga también oscuro— en Chrome, Firefox y
   Safari, sin tener que recurrir a un pseudo-elemento propio de cada motor. */
.napp .napp-co-campo input[type="date"] { color-scheme: dark; }
.napp .napp-co-acciones { grid-column: 1 / -1; margin: .3rem 0 0; text-align: center; }
.napp .napp-co-err {
  grid-column: 1 / -1;
  margin: 0;
  background: rgba(150, 10, 10, .82);
  color: #fff;
  font-weight: 700;
  padding: .5rem .9rem;
  border-radius: 8px;
  text-align: center;
}

.napp .napp-co-resultado {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(19rem, 100%), 1fr));
  gap: 1rem;
  animation: napp-entra .4s ease both;
}
.napp .napp-co-bloque {
  background: rgba(0, 0, 0, .3);
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 12px;
  padding: 1rem;
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: .6rem;
}
/* El flex-wrap va explícito porque estas cajas son etiquetas sueltas
   (header, figure, section) y cualquier tema puede tener una regla suya
   para ellas: lo que no declaro yo, lo declara él. */
.napp .napp-co-cab { display: flex; flex-wrap: nowrap; align-items: center; gap: .9rem; }
/* Las cifras heredadas son casi negras y en pequeño se perdían sobre el fondo
   oscuro: se les pone un halo detrás (el PNG es transparente, así que el
   degradado se ve por dentro) y un contorno blanco que las despega. */
.napp .napp-co-img {
  width: clamp(3.4rem, 13vw, 4.6rem);
  height: auto;
  flex: none;
  background: radial-gradient(circle,
              rgba(235, 245, 255, .5) 0%, rgba(190, 220, 255, .2) 45%, rgba(0, 0, 0, 0) 70%);
  filter: drop-shadow(0 2px 5px rgba(0, 0, 0, .65)) drop-shadow(0 0 5px rgba(255, 255, 255, .85));
}
.napp .napp-co-rotulo { margin: 0; font-size: .74rem; letter-spacing: .12em; text-transform: uppercase; color: #92b6d8; }
.napp .napp-co-origen { display: block; letter-spacing: 0; text-transform: none; font-size: .8rem; color: #6f92b4; font-style: italic; }
.napp .napp-co-titulo { margin: .15rem 0 0; font-family: Georgia, "Times New Roman", serif; font-size: 1.15rem; color: #ffd86b; }
.napp .napp-co-texto { margin: 0; line-height: 1.55; }
.napp .napp-co-extra { margin: 0; font-size: .92rem; color: #bcd8f2; line-height: 1.5; }
.napp .napp-co-extra b { color: #ffd86b; }
.napp .napp-co-calculo { margin-top: auto; }
.napp .napp-co-calculo summary { cursor: pointer; font-size: .8rem; color: #92b6d8; }
.napp .napp-co-calculo summary:focus-visible { outline: 2px solid #ffd76b; outline-offset: 2px; }
.napp .napp-co-calculo p { margin: .5rem 0 0; }
.napp .napp-co-letras { line-height: 2; }
.napp .napp-co-pasos { font-variant-numeric: tabular-nums; }
.napp .napp-co-pasos b { color: #7dffa6; }

/* ── Compatibilidad: dos nombres y una barra de afinidad ────────── */
.napp .napp-cp {
  position: relative;
  border-radius: 14px;
  padding: 1.4rem 1.2rem 1.7rem;
  background:
    radial-gradient(1px 1px at 20% 14%, rgba(255, 255, 255, .7), rgba(255, 255, 255, 0)),
    radial-gradient(1px 1px at 74% 20%, rgba(255, 255, 255, .55), rgba(255, 255, 255, 0)),
    radial-gradient(ellipse at 50% 0%, #5e1b52 0%, #360f36 48%, #14061a 100%);
  color: #ffeaf6;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.2rem;
  text-align: center;
}
.napp .napp-cp .napp-intro { color: #f2ccdf; }
.napp .napp-cp-form {
  width: 100%;
  max-width: 34rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(13rem, 100%), 1fr));
  gap: .7rem 1rem;
  text-align: left;
}
.napp .napp-cp-resultado { width: 100%; display: flex; flex-direction: column; align-items: center; gap: .9rem; animation: napp-entra .4s ease both; }
.napp .napp-cp-pareja { display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; gap: 1.2rem; }
.napp .napp-cp-pareja figure { margin: 0; padding: 0; display: flex; flex-wrap: nowrap; flex-direction: column; align-items: center; gap: .2rem; }
.napp .napp-cp-pareja img {
  width: clamp(4rem, 17vw, 6rem);
  height: auto;
  background: radial-gradient(circle,
              rgba(255, 235, 250, .5) 0%, rgba(255, 190, 230, .2) 45%, rgba(0, 0, 0, 0) 70%);
  filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .6)) drop-shadow(0 0 5px rgba(255, 255, 255, .85));
}
.napp .napp-cp-pareja figcaption { font-size: .85rem; color: #f0b9d6; max-width: 9rem; }
.napp .napp-cp-mas { font-size: 1.6rem; color: #ff9ecd; font-weight: 700; }
.napp .napp-cp-rotulo { margin: 0; font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; color: #e3a3c6; }

/* La barra, como el progress bar del legacy pero sin librería */
.napp .napp-cp-barra {
  width: min(100%, 30rem);
  height: 1.6rem;
  border-radius: 999px;
  background: rgba(0, 0, 0, .45);
  border: 1px solid rgba(255, 255, 255, .22);
  overflow: hidden;
}
.napp .napp-cp-relleno {
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: linear-gradient(90deg, #ff5f8f, #ffb03b, #7dff9f);
  display: flex;
  align-items: center;
  justify-content: flex-end;
  transition: width 1.1s cubic-bezier(.2, .8, .25, 1);
}
.napp .napp-cp-pct { font-size: .8rem; font-weight: 700; color: #21102a; padding: 0 .6rem; font-variant-numeric: tabular-nums; }
.napp .napp-cp-texto { margin: 0; max-width: 34rem; font-size: clamp(1rem, 3vw, 1.12rem); font-weight: 600; line-height: 1.5; }

/* ── Numerología diaria: día, mes y año personales ──────────────── */
.napp .napp-di {
  position: relative;
  border-radius: 14px;
  padding: 1.4rem 1.2rem 1.7rem;
  background:
    radial-gradient(1px 1px at 16% 18%, rgba(255, 255, 255, .7), rgba(255, 255, 255, 0)),
    radial-gradient(1px 1px at 80% 12%, rgba(255, 255, 255, .55), rgba(255, 255, 255, 0)),
    radial-gradient(ellipse at 50% 0%, #14523f 0%, #0d3229 48%, #05130f 100%);
  color: #e8fff5;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.2rem;
  text-align: center;
}
.napp .napp-di .napp-intro { color: #c6ecd9; }
.napp .napp-di-form {
  width: 100%;
  max-width: 24rem;
  display: flex;
  flex-direction: column;
  gap: .7rem;
  text-align: left;
}
.napp .napp-di-resultado { width: 100%; display: flex; flex-direction: column; gap: 1rem; animation: napp-entra .4s ease both; }
.napp .napp-di-hoy { margin: 0; font-size: .84rem; letter-spacing: .1em; text-transform: uppercase; color: #8fc9b0; }
.napp .napp-di-bloques { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(17rem, 100%), 1fr)); gap: 1rem; }
.napp .napp-di-bloque { background: rgba(0, 0, 0, .3); border-color: rgba(255, 255, 255, .14); }
.napp .napp-di .napp-co-rotulo { color: #8fc9b0; }
.napp .napp-di .napp-co-titulo { color: #9dffd0; }
.napp .napp-di-como { margin: auto 0 0; font-size: .8rem; font-style: italic; color: #79b39a; line-height: 1.45; }

@media (max-width: 480px) {
  .napp .napp-ca, .napp .napp-co, .napp .napp-cp, .napp .napp-di { padding: 1.1rem .8rem 1.3rem; }
  .napp .napp-ca-alfabetos { flex-direction: column; align-items: flex-start; }
  .napp .napp-cp-pareja { gap: .7rem; }
}

@media (prefers-reduced-motion: reduce) {
  .napp .napp-ca-resultado, .napp .napp-co-resultado,
  .napp .napp-cp-resultado, .napp .napp-di-resultado { animation: none; }
  .napp .napp-cp-relleno { transition-duration: .2s; }
}

/* ── Biorritmos ─────────────────────────────────────────────────────
   Tres senos sobre fondo de noche. La gráfica es SVG dibujado por el JS:
   el viewBox no se escala en proporción (preserveAspectRatio="none") para
   que la curva ocupe todo el ancho sin dejar aire a los lados. */
.napp .napp-bi {
  position: relative;
  border-radius: 14px;
  padding: 1.4rem 1.2rem 1.6rem;
  background: radial-gradient(ellipse at 50% 0%, #1c2a5e 0%, #141a40 48%, #080a1c 100%);
  color: #e7ecff;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.1rem;
  text-align: center;
}
.napp .napp-bi .napp-intro { color: #c3cff5; }
.napp .napp-bi-form {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-end;
  gap: .8rem;
}
.napp .napp-bi-resultado {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
  animation: napp-entra .4s ease both;
}
.napp .napp-bi-cabecera {
  margin: 0;
  font-size: .8rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #93a6dd;
}

/* La gráfica */
.napp .napp-bi-figura { margin: 0; width: 100%; }
.napp .napp-bi-lienzo {
  width: 100%;
  border-radius: 12px;
  padding: .5rem .3rem .2rem;
  background: rgba(0, 0, 0, .3);
  border: 1px solid rgba(255, 255, 255, .1);
}
.napp .napp-bi-svg { display: block; width: 100%; height: clamp(9rem, 30vw, 13rem); }
.napp .napp-bi-eje  { stroke: rgba(255, 255, 255, .35); stroke-width: 1; }
.napp .napp-bi-reja { stroke: rgba(255, 255, 255, .09); stroke-width: 1; }
.napp .napp-bi-hoy  { stroke: #ffd76b; stroke-width: 1.4; stroke-dasharray: 4 3; }
.napp .napp-bi-rot  { fill: #8fa0d6; font-size: 11px; font-family: inherit; }
.napp .napp-bi-rot-hoy { fill: #ffd76b; font-weight: 700; }
/* El color va SOLO en el trazo: si se pone también el relleno, la curva se
   convierte en una mancha (el relleno gana al `fill:none` de arriba, que
   tiene la misma especificidad). El relleno es cosa de los puntos. */
.napp .napp-bi-curva { fill: none; stroke-width: 2.4; vector-effect: non-scaling-stroke; }
.napp .napp-bi-c-fisico      { stroke: #f08a70; }
.napp .napp-bi-c-emocional   { stroke: #e58ac0; }
.napp .napp-bi-c-intelectual { stroke: #74b6f0; }
.napp .napp-bi-marca { stroke: #0a0f24; stroke-width: 1.5; }
.napp .napp-bi-marca.napp-bi-c-fisico      { fill: #f08a70; stroke: #0a0f24; }
.napp .napp-bi-marca.napp-bi-c-emocional   { fill: #e58ac0; stroke: #0a0f24; }
.napp .napp-bi-marca.napp-bi-c-intelectual { fill: #74b6f0; stroke: #0a0f24; }
.napp .napp-bi-leyenda {
  margin: .4rem 0 0;
  font-size: .82rem;
  color: #93a6dd;
  font-variant-numeric: tabular-nums;
}

/* Las tres fichas */
.napp .napp-bi-ciclos {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr));
  gap: .8rem;
}
.napp .napp-bi-ciclo {
  padding: .9rem 1rem 1rem;
  border-radius: 12px;
  background: rgba(0, 0, 0, .3);
  border: 1px solid rgba(255, 255, 255, .12);
  text-align: left;
}
.napp .napp-bi-ciclo header { display: flex; align-items: center; gap: .5rem; margin-bottom: .35rem; }
.napp .napp-bi-punto { width: .7rem; height: .7rem; border-radius: 50%; flex: none; }
.napp .napp-bi-ciclo[data-ciclo="fisico"]      .napp-bi-punto { background: #f08a70; }
.napp .napp-bi-ciclo[data-ciclo="emocional"]   .napp-bi-punto { background: #e58ac0; }
.napp .napp-bi-ciclo[data-ciclo="intelectual"] .napp-bi-punto { background: #74b6f0; }
.napp .napp-bi-nombre { margin: 0; font-size: 1rem; font-weight: 700; color: #fff; }
.napp .napp-bi-ciclo .napp-bi-pct {
  margin-left: auto;
  font-variant-numeric: tabular-nums;
  font-size: 1.05rem;
  color: #ffd76b;
}
.napp .napp-bi-estado {
  margin: 0 0 .3rem;
  font-size: .78rem;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: #93a6dd;
}
.napp .napp-bi-ciclo[data-estado="critico"] { border-color: rgba(255, 180, 120, .55); }
.napp .napp-bi-ciclo[data-estado="critico"] .napp-bi-estado { color: #ffbe8a; }
.napp .napp-bi-texto { margin: 0; font-size: .9rem; line-height: 1.55; color: #cfd8f5; }

/* Los ciclos secundarios, plegados */
.napp .napp-bi-extras { text-align: left; font-size: .9rem; color: #cfd8f5; }
.napp .napp-bi-extras summary { cursor: pointer; color: #ffd76b; }
.napp .napp-bi-extras-nota { margin: .5rem 0; font-size: .84rem; color: #93a6dd; }
.napp .napp-bi-extras-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem .9rem; }
.napp .napp-bi-extras-lista li { display: flex; gap: .4rem; font-variant-numeric: tabular-nums; }
.napp .napp-bi-extras-lista b { color: #fff; font-weight: 600; }

/* Días críticos y mejor día */
.napp .napp-bi-avisos {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr));
  gap: .8rem;
  text-align: left;
}
.napp .napp-bi-avisos h3 {
  margin: 0 0 .4rem;
  font-size: .78rem;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: #93a6dd;
  font-weight: 700;
}
.napp .napp-bi-lista-criticos { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .25rem; }
.napp .napp-bi-lista-criticos li { font-size: .88rem; color: #cfd8f5; font-variant-numeric: tabular-nums; }
.napp .napp-bi-doble { color: #ffbe8a; }
.napp .napp-bi-mejor { margin: 0; font-size: .95rem; color: #fff; font-variant-numeric: tabular-nums; }
.napp .napp-bi-aviso { margin: 0; max-width: 40rem; font-size: .78rem; line-height: 1.55; color: #8b9ac9; }

@media (prefers-reduced-motion: reduce) {
  .napp .napp-bi-resultado { animation: none; }
}

/* ── Biorritmos de pareja ───────────────────────────────────────────
   Dos personas, tres ondas y una lectura que distingue sincronía fija de
   energía conjunta. La segunda curva conserva un trazo discontinuo para que
   el resultado siga siendo legible sin depender solo del color. */
.napp.napp-signature[data-motor="biopareja"] { --sig-accent: #eaa1bd; --sig-accent-rgb: 234, 161, 189; }
.napp-signature[data-motor="biopareja"] .napp-signature-visual img { object-position: center 47%; }
.napp .napp-bp {
  position: relative;
  width: 100%;
  color: #f3efff;
  text-align: center;
}
.napp .napp-bp-kicker,
.napp .napp-bp-result-kicker {
  margin: 0 0 .45rem;
  color: var(--sig-accent);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.napp .napp-bp .napp-intro { color: #ddd8f0; }
.napp.napp-signature .napp-bp-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .9rem;
  max-width: 48rem;
}
.napp .napp-bp-persona {
  position: relative;
  min-width: 0;
  display: grid;
  gap: .72rem;
  margin: 0;
  padding: 1rem;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 1rem;
  background:
    radial-gradient(circle at 100% 0%, rgba(var(--sig-accent-rgb), .11), transparent 42%),
    rgba(0, 0, 0, .22);
  text-align: left;
}
.napp .napp-bp-persona[data-quien="b"] {
  background:
    radial-gradient(circle at 100% 0%, rgba(91, 190, 235, .12), transparent 42%),
    rgba(0, 0, 0, .22);
}
.napp .napp-bp-persona legend {
  padding: 0 .45rem;
  color: #ffd5e4;
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.napp .napp-bp-persona[data-quien="b"] legend { color: #95dbf5; }
.napp .napp-bp-form .napp-co-campo { gap: .38rem; }
.napp .napp-bp-form .napp-co-campo span { font-size: .68rem; letter-spacing: .1em; }
.napp .napp-bp-form .napp-co-acciones { grid-column: 1 / -1; margin: .25rem 0 0; text-align: center; }
.napp .napp-bp-form .napp-bp-err { grid-column: 1 / -1; margin: 0; }

.napp .napp-bp-resultado {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.napp .napp-bp-total {
  display: grid;
  grid-template-columns: minmax(9.5rem, .34fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(1rem, 4vw, 2rem);
  padding: clamp(1.1rem, 3vw, 1.6rem);
  border: 1px solid rgba(var(--sig-accent-rgb), .30);
  border-radius: 1.15rem;
  background:
    radial-gradient(circle at 14% 50%, rgba(var(--sig-accent-rgb), .12), transparent 32%),
    linear-gradient(145deg, rgba(255, 255, 255, .035), rgba(0, 0, 0, .24));
  text-align: left;
}
.napp .napp-bp-result-kicker,
.napp .napp-bp-quienes { grid-column: 1 / -1; text-align: center; }
.napp .napp-bp-quienes {
  margin: -.15rem 0 .2rem;
  color: #c8c0df;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.napp .napp-bp-ring {
  --bp-total: 0;
  aspect-ratio: 1;
  width: min(100%, 10.8rem);
  margin: 0 auto;
  display: grid;
  place-content: center;
  justify-items: center;
  border-radius: 50%;
  background:
    radial-gradient(circle, #0d0b20 0 57%, transparent 58%),
    conic-gradient(from -90deg, var(--sig-accent) calc(var(--bp-total) * 1%), rgba(255, 255, 255, .09) 0);
  box-shadow: 0 0 0 .45rem rgba(var(--sig-accent-rgb), .055), 0 0 2.2rem rgba(var(--sig-accent-rgb), .13);
}
.napp .napp-bp-pct {
  display: block;
  color: #fff2d2;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.25rem, 8vw, 3.35rem);
  font-weight: 400;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.napp .napp-bp-rotulo {
  max-width: 6.5rem;
  margin-top: .35rem;
  color: #c9bedc;
  font-size: .59rem;
  font-weight: 750;
  letter-spacing: .1em;
  line-height: 1.35;
  text-align: center;
  text-transform: uppercase;
}
.napp .napp-bp-titulo {
  margin: 0 0 .45rem;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.45rem, 4vw, 2rem);
  font-weight: 400;
}
.napp .napp-bp-veredicto { margin: 0; color: #e0daef; font-size: .96rem; line-height: 1.68; text-wrap: pretty; }
.napp .napp-bp-fijo {
  margin: .8rem 0 0;
  padding-top: .8rem;
  border-top: 1px solid rgba(255, 255, 255, .09);
  color: #a9a1c2;
  font-size: .79rem;
  line-height: 1.6;
}
.napp .napp-bp-total[data-banda="muy_alta"] { border-color: rgba(255, 218, 145, .48); }
.napp .napp-bp-total[data-banda="opuesta"] { border-color: rgba(104, 193, 230, .38); }

.napp .napp-bp-ciclos {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
}
.napp .napp-bp-ciclo {
  min-width: 0;
  padding: 1rem;
  border: 1px solid rgba(255, 255, 255, .11);
  border-radius: 1rem;
  background: rgba(0, 0, 0, .22);
  text-align: left;
}
.napp .napp-bp-ciclo[data-banda="alta"] { border-color: rgba(var(--sig-accent-rgb), .25); }
.napp .napp-bp-ciclo header { display: flex; align-items: center; gap: .55rem; margin-bottom: .7rem; }
.napp .napp-bp-punto { width: .65rem; height: .65rem; border-radius: 50%; flex: none; box-shadow: 0 0 .75rem currentColor; }
.napp .napp-bp-ciclo[data-ciclo="fisico"] .napp-bp-punto { color: #f08a70; background: #f08a70; }
.napp .napp-bp-ciclo[data-ciclo="emocional"] .napp-bp-punto { color: #e58ac0; background: #e58ac0; }
.napp .napp-bp-ciclo[data-ciclo="intelectual"] .napp-bp-punto { color: #74b6f0; background: #74b6f0; }
.napp .napp-bp-ciclo .napp-bp-nombre { margin: 0; color: #fff; font-size: .98rem; font-weight: 750; }
.napp .napp-bp-ciclo header small { display: block; margin-top: .08rem; color: #89839e; font-size: .65rem; letter-spacing: .08em; text-transform: uppercase; }
.napp .napp-bp-cpct { margin-left: auto; color: #ffe1a1; font-size: 1.08rem; font-variant-numeric: tabular-nums; }
.napp .napp-bp-mini {
  overflow: hidden;
  margin-bottom: .7rem;
  padding: .2rem .25rem;
  border: 1px solid rgba(255, 255, 255, .055);
  border-radius: .7rem;
  background: rgba(2, 3, 13, .62);
}
.napp .napp-bp-svg { display: block; width: 100%; height: 7rem; }
.napp .napp-bp-b { stroke-dasharray: 7 5; opacity: .72; }
.napp .napp-bp-ciclo .napp-bp-texto { margin: 0; color: #c9c2dd; font-size: .83rem; line-height: 1.58; text-wrap: pretty; }
.napp .napp-bp-leyenda {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: .6rem 1.2rem;
  margin: 0;
  color: #bcb4d1;
  font-size: .76rem;
}
.napp .napp-bp-leyenda span { display: inline-flex; align-items: center; gap: .48rem; }
.napp .napp-bp-muestra { display: inline-block; width: 2.15rem; border-top: 2px solid #eaa1bd; }
.napp .napp-bp-muestra-b { border-color: #74c8ef; border-top-style: dashed; }

.napp .napp-bp-dias {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .8rem;
  text-align: left;
}
.napp .napp-bp-dias section {
  padding: 1rem;
  border: 1px solid rgba(255, 255, 255, .10);
  border-radius: 1rem;
  background: linear-gradient(145deg, rgba(var(--sig-accent-rgb), .06), rgba(0, 0, 0, .2));
}
.napp .napp-bp-dias section + section { background: linear-gradient(145deg, rgba(90, 174, 224, .065), rgba(0, 0, 0, .2)); }
.napp .napp-bp-dias h3 {
  margin: 0 0 .35rem;
  color: #f0b9ce;
  font-size: .73rem;
  font-weight: 800;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.napp .napp-bp-dias section + section h3 { color: #9ed7f1; }
.napp .napp-bp-dias section > p { margin: 0 0 .75rem; color: #9d96b1; font-size: .75rem; line-height: 1.5; }
.napp .napp-bp-dias ul { list-style: none; counter-reset: bp-dia; margin: 0; padding: 0; display: grid; gap: .38rem; }
.napp .napp-bp-dias li {
  counter-increment: bp-dia;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: .55rem;
  color: #ddd7ec;
  font-size: .82rem;
  font-variant-numeric: tabular-nums;
}
.napp .napp-bp-dias li::before {
  content: counter(bp-dia, decimal-leading-zero);
  color: #756f8b;
  font-size: .64rem;
  letter-spacing: .08em;
}
.napp .napp-bp-dias li b { color: #ffe0a0; font-size: .84rem; }
.napp .napp-bp-delicados li b { color: #a8dff5; }
.napp .napp-bp-reset-wrap { margin: .15rem 0 0; text-align: center; }
.napp .napp-bp-reset {
  padding: .5rem .85rem;
  border: 0;
  border-bottom: 1px solid rgba(var(--sig-accent-rgb), .38);
  color: #c4bad6;
  background: transparent;
  font: inherit;
  font-size: .78rem;
  cursor: pointer;
}
.napp .napp-bp-reset:hover { color: #fff; border-color: var(--sig-accent); }

@media (min-width: 761px) {
  /* En esta app la imagen está compuesta expresamente como un encuentro de
     dos perfiles: conservarla panorámica comunica mejor la idea que recortar
     cada rostro en la portada lateral común de la colección. */
  .napp.napp-signature[data-motor="biopareja"]:not(.has-result) .napp-signature-shell {
    display: block;
    padding: 0;
  }
  .napp.napp-signature[data-motor="biopareja"]:not(.has-result) .napp-signature-visual {
    height: clamp(14rem, 28vw, 17rem);
    min-height: 0;
    border-radius: 0;
  }
  .napp.napp-signature[data-motor="biopareja"]:not(.has-result) .napp-signature-visual figcaption {
    right: auto;
    bottom: 1.5rem;
    left: 2rem;
    flex-direction: row;
    align-items: center;
  }
  .napp.napp-signature[data-motor="biopareja"]:not(.has-result) .napp-signature-body {
    width: calc(100% - clamp(1.2rem, 4vw, 3rem));
    margin: -2.7rem auto 1.25rem;
    padding: clamp(1.15rem, 3.5vw, 2rem);
    border: 1px solid rgba(255, 255, 255, .10);
    background: rgba(10, 8, 23, .91);
    box-shadow: 0 1rem 2.6rem rgba(0, 0, 0, .28), inset 0 1px rgba(255, 255, 255, .035);
    backdrop-filter: blur(14px);
  }
}
@media (max-width: 760px) {
  .napp .napp-bp-ciclos { grid-template-columns: 1fr; }
  .napp .napp-bp-svg { height: 8rem; }
}
@media (max-width: 620px) {
  .napp.napp-signature .napp-bp-form,
  .napp .napp-bp-dias { grid-template-columns: 1fr; }
  .napp .napp-bp-total { grid-template-columns: 1fr; text-align: center; }
  .napp .napp-bp-veredicto, .napp .napp-bp-fijo { text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
  .napp .napp-bp-resultado { animation: none; }
}

/* ── Pináculos y desafíos ──────────────────────────────────────────────────
   Una línea de cuatro tramos. La regla del proyecto: minmax(min(Xrem,100%))
   en todas las rejillas, o en un iframe estrecho la caja se desborda. */
/* La entrada, centrada como el título y el botón: antes la entradilla y la
   nota se iban al borde izquierdo a todo lo ancho y quedaban descolgadas. */
.napp .napp-ci .napp-intro { margin: 0 auto 1.5rem; max-width: 38rem; text-align: center; }

.napp .napp-ci-form {
  display: flex; flex-direction: column; align-items: center;
  gap: 1.1rem;
  text-align: center;
}
.napp .napp-ci-form .napp-co-campo { align-items: center; width: 100%; max-width: 17rem; gap: .4rem; }
.napp .napp-ci-form .napp-co-campo input { width: 100%; text-align: center; }
.napp .napp-ci-form .napp-co-acciones { margin: 0; }

/* La nota va suelta debajo: necesita separarse del formulario y no ocupar
   todo el ancho, o se lee como si fuera parte de él. */
.napp .napp-ci-aviso {
  margin: 2rem auto 0;
  max-width: 38rem;
  text-align: center;
  font-size: .78rem;
  line-height: 1.65;
  color: #8b9ac9;
  text-wrap: pretty;
}

.napp .napp-ci-resultado { margin-top: 1.8rem; }
.napp .napp-ci-camino {
  margin: 0 0 1rem;
  font-size: clamp(1rem, 3vw, 1.15rem);
  opacity: .92;
}

.napp .napp-ci-linea { list-style: none; margin: 0; padding: 0; display: grid; gap: .8rem; }
.napp .napp-ci-tramo {
  position: relative;
  padding: .9rem 1rem;
  border: 1px solid rgba(255, 255, 255, .16);
  border-left: 3px solid rgba(255, 255, 255, .22);
  border-radius: .6rem;
  background: rgba(0, 0, 0, .18);
}
.napp .napp-ci-tramo.es-ahora {
  border-left-color: currentColor;
  background: rgba(255, 255, 255, .06);
}
.napp .napp-ci-tramo header {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem;
  margin-bottom: .7rem;
}
.napp .napp-ci-orden {
  font-size: .72rem; letter-spacing: .09em; text-transform: uppercase; opacity: .65;
}
.napp .napp-ci-edades { font-size: .95rem; font-variant-numeric: tabular-nums; }
.napp .napp-ci-ahora {
  font-size: .7rem; letter-spacing: .08em; text-transform: uppercase;
  padding: .12rem .45rem;
  border: 1px solid currentColor; border-radius: 1rem;
  opacity: .9;
}

.napp .napp-ci-par {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(17rem, 100%), 1fr));
  gap: .8rem;
}
.napp .napp-ci-par section { display: flex; gap: .7rem; align-items: flex-start; }
.napp .napp-ci-cifra {
  flex: none;
  display: grid; place-items: center;
  width: 2.4rem; aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, .28);
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
}
.napp .napp-ci-des .napp-ci-cifra { border-style: dashed; opacity: .8; }
.napp .napp-ci-par p { margin: 0; }
.napp .napp-ci-par .versalita { font-size: .72rem; letter-spacing: .09em; text-transform: uppercase; opacity: .7; margin-bottom: .25rem; }
.napp .napp-ci-ptexto,
.napp .napp-ci-dtexto { font-size: .92rem; line-height: 1.6; opacity: .92; }

/* ── Lecciones kármicas y pasión oculta ────────────────────────────────────
   Lo propio es la rejilla del 1 al 9: el mapa de tu nombre. Todo centrado,
   como en los ciclos, y minmax(min(...)) para que no desborde en estrecho. */
.napp .napp-ka .napp-intro { margin: 0 auto 1.5rem; max-width: 38rem; text-align: center; }
.napp .napp-ka-form {
  display: flex; flex-direction: column; align-items: center; gap: 1rem; text-align: center;
}
.napp .napp-ka-form .napp-co-campo { align-items: center; width: 100%; max-width: 20rem; gap: .4rem; }
.napp .napp-ka-form .napp-co-campo input { width: 100%; text-align: center; }
.napp .napp-ka-form .napp-co-acciones { margin: 0; }

.napp .napp-ka-resultado { margin-top: 1.8rem; }
.napp .napp-ka-resumen { margin: 0 0 1rem; text-align: center; font-size: 1.02rem; opacity: .92; }

.napp .napp-ka-rejilla {
  list-style: none; margin: 0 auto; padding: 0;
  /* Cuadrado de 3x3, que es como se ha enseñado siempre esta rejilla. */
  max-width: 17rem;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .5rem;
}
.napp .napp-ka-celda {
  display: flex; flex-direction: column; align-items: center; gap: .1rem;
  padding: .55rem .3rem;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: .5rem;
  background: rgba(0, 0, 0, .2);
}
.napp .napp-ka-n { font-size: 1.25rem; font-variant-numeric: tabular-nums; }
.napp .napp-ka-veces {
  font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; opacity: .6;
  font-variant-numeric: tabular-nums;
}
/* La que falta: hueca y con el borde marcado. La más repetida: rellena. */
.napp .napp-ka-celda.es-falta {
  border-style: dashed;
  border-color: currentColor;
  background: transparent;
}
.napp .napp-ka-celda.es-falta .napp-ka-n { opacity: .45; }
.napp .napp-ka-celda.es-pasion {
  border-color: currentColor;
  background: rgba(255, 255, 255, .09);
}

.napp .napp-ka-leyenda {
  margin: .7rem auto 0; text-align: center;
  font-size: .76rem; opacity: .7;
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: .4rem 1rem;
}
.napp .napp-ka-marca {
  display: inline-block; width: .95rem; height: .95rem; vertical-align: -.15rem;
  border: 1px solid currentColor; border-radius: .25rem;
}
.napp .napp-ka-marca.es-falta { border-style: dashed; }
.napp .napp-ka-marca.es-pasion { background: rgba(255, 255, 255, .35); }

.napp .napp-ka-cab {
  margin: 1.8rem 0 .7rem;
  font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; opacity: .75;
}
.napp .napp-ka-lecciones,
.napp .napp-ka-pasiones { list-style: none; margin: 0; padding: 0; display: grid; gap: .7rem; }
.napp .napp-ka-ficha {
  display: flex; gap: .8rem; align-items: flex-start;
  padding: .8rem .9rem;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: .6rem;
  background: rgba(0, 0, 0, .18);
}
.napp .napp-ka-ficha.es-completa { justify-content: center; text-align: center; }
.napp .napp-ka-cifra {
  flex: none; display: grid; place-items: center;
  width: 2.3rem; aspect-ratio: 1;
  border: 1px solid rgba(255, 255, 255, .3); border-radius: 50%;
  font-size: 1.05rem; font-variant-numeric: tabular-nums;
}
.napp .napp-ka-ficha p { margin: 0; }
.napp .napp-ka-ficha .versalita { font-size: .72rem; letter-spacing: .09em; text-transform: uppercase; opacity: .72; margin-bottom: .25rem; }
.napp .napp-ka-ficha p:last-child { font-size: .93rem; line-height: 1.6; opacity: .93; }

/* ── Matriz del Destino ────────────────────────────────────────────────────
   Lo propio es el octograma en SVG: el rombo personal, el cuadrado del
   linaje y la esencia en el centro. Los puntos se tocan y llevan a su ficha.
   Mismo lenguaje que las hermanas: escena oscura, bordes suaves, versalitas. */
.napp .napp-mx .napp-intro { margin: 0 auto 1.5rem; max-width: 38rem; text-align: center; }
.napp .napp-mx-form {
  display: flex; flex-direction: column; align-items: center; gap: 1.1rem; text-align: center;
}
.napp .napp-mx-form .napp-co-campo { align-items: center; width: 100%; max-width: 17rem; gap: .4rem; }
.napp .napp-mx-form .napp-co-campo input { width: 100%; text-align: center; }
.napp .napp-mx-form .napp-co-acciones { margin: 0; }

.napp .napp-mx-resultado { margin-top: 1.6rem; }

.napp .napp-mx-figura { margin: 0 auto 1.6rem; max-width: 26rem; }
.napp .napp-mx-lienzo svg { display: block; width: 100%; height: auto; }
.napp .napp-mx-leyenda {
  margin-top: .6rem; text-align: center;
  font-size: .78rem; line-height: 1.6; color: #8b9ac9; text-wrap: pretty;
}

.napp .napp-mx-trazo { fill: none; stroke: rgba(255, 255, 255, .30); stroke-width: 1.5; }
.napp .napp-mx-eje   { stroke: rgba(255, 255, 255, .14); stroke-width: 1; stroke-dasharray: 3 4; }
.napp .napp-mx-edad  { fill: rgba(255, 255, 255, .45); font-size: 10px; text-anchor: middle; }

.napp .napp-mx-punto { cursor: pointer; }
.napp .napp-mx-punto circle { stroke-width: 1.5; transition: filter .15s ease; }
.napp .napp-mx-punto text {
  fill: #fff; font-size: 15px; font-weight: 700; text-anchor: middle;
  font-variant-numeric: tabular-nums; pointer-events: none;
}
.napp .napp-mx-punto.es-personal circle { fill: rgba(122, 92, 255, .38);  stroke: rgba(190, 170, 255, .85); }
.napp .napp-mx-punto.es-linaje  circle { fill: rgba(255, 190, 92, .22);  stroke: rgba(255, 210, 130, .75); }
.napp .napp-mx-punto.es-esencia circle { fill: rgba(255, 216, 107, .30); stroke: #ffd86b; }
.napp .napp-mx-punto.es-esencia text { font-size: 17px; }
.napp .napp-mx-punto:hover circle,
.napp .napp-mx-punto:focus-visible circle { filter: brightness(1.35); }
.napp .napp-mx-punto:focus-visible { outline: none; }

/* La esencia: la única ficha que nace desplegada, con su carta grande. */
.napp .napp-mx-esencia {
  margin: 0 0 1.8rem;
  padding: 1.1rem 1.2rem;
  border: 1px solid rgba(255, 216, 107, .45);
  border-radius: .7rem;
  background: rgba(255, 216, 107, .07);
}
.napp .napp-mx-esencia > .versalita {
  font-size: .72rem; letter-spacing: .09em; text-transform: uppercase; opacity: .75;
  margin: 0 0 .7rem;
}
.napp .napp-mx-ecab { display: flex; gap: .9rem; align-items: center; margin-bottom: .7rem; }
.napp .napp-mx-eimg { width: 74px; border-radius: .35rem; box-shadow: 0 3px 12px rgba(0, 0, 0, .45); }
.napp .napp-mx-erotulo { margin: 0; font-size: .8rem; opacity: .75; }
.napp .napp-mx-enombre { margin: .15rem 0 0; font-size: clamp(1.05rem, 3vw, 1.3rem); }
.napp .napp-mx-etexto { margin: 0 0 .8rem; line-height: 1.65; }
.napp .napp-mx-caras p { margin: .3rem 0; font-size: .9rem; line-height: 1.6; opacity: .92; }

.napp .napp-mx-cab {
  margin: 1.6rem 0 .8rem;
  font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; opacity: .7;
}

.napp .napp-mx-lista {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(19rem, 100%), 1fr));
  gap: .8rem;
}
.napp .napp-mx-ficha {
  display: flex; gap: .8rem; align-items: flex-start;
  padding: .85rem .95rem;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: .6rem;
  background: rgba(0, 0, 0, .18);
  scroll-margin: 5rem;
}
.napp .napp-mx-ficha.es-destacada { border-color: #ffd86b; box-shadow: 0 0 0 1px #ffd86b inset; }
.napp .napp-mx-mini { flex: none; width: 52px; border-radius: .3rem; box-shadow: 0 2px 8px rgba(0, 0, 0, .4); }
.napp .napp-mx-ficha .versalita {
  margin: 0 0 .15rem;
  font-size: .7rem; letter-spacing: .09em; text-transform: uppercase; opacity: .7;
}
.napp .napp-mx-ficha h4 { margin: 0 0 .3rem; font-size: 1rem; }
.napp .napp-mx-pos { margin: 0 0 .35rem; font-size: .84rem; line-height: 1.55; opacity: .75; }
.napp .napp-mx-ese { margin: 0 0 .4rem; font-size: .92rem; line-height: 1.6; }
.napp .napp-mx-ficha details summary {
  cursor: pointer; font-size: .76rem; letter-spacing: .04em; opacity: .7;
}
.napp .napp-mx-ficha details[open] summary { opacity: .5; }
.napp .napp-mx-ficha details p { margin: .35rem 0 0; font-size: .88rem; line-height: 1.6; }

.napp .napp-mx-colasec { margin-top: .4rem; }
.napp .napp-mx-cola-x { margin: 0 0 .8rem; font-size: .92rem; line-height: 1.65; opacity: .9; }
.napp .napp-mx-lista[data-grupo="cola"] {
  display: flex; flex-wrap: wrap; gap: .6rem;
}
.napp .napp-mx-chip {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .4rem .8rem;
  border: 1px dashed rgba(255, 255, 255, .35);
  border-radius: 2rem;
  text-decoration: none; color: inherit;
  font-size: .9rem;
}
.napp .napp-mx-chip b { font-variant-numeric: tabular-nums; }
.napp .napp-mx-chip:hover { border-color: #ffd86b; }

/* ── Año personal, número de la suerte y casa ─────────────────────────────
   Las tres comparten la tarjeta grande con cifra (.napp-an-anio): la del año
   en curso, la del número principal de la suerte y la de la energía del
   hogar. Formularios centrados como sus hermanas. */
.napp .napp-an .napp-intro,
.napp .napp-su .napp-intro,
.napp .napp-ho .napp-intro { margin: 0 auto 1.5rem; max-width: 38rem; text-align: center; }
.napp .napp-an-form, .napp .napp-su-form, .napp .napp-ho-form {
  display: flex; flex-direction: column; align-items: center; gap: 1.1rem; text-align: center;
}
.napp .napp-an-form .napp-co-campo, .napp .napp-ho-form .napp-co-campo { align-items: center; width: 100%; max-width: 17rem; gap: .4rem; }
.napp .napp-su-form .napp-co-campo { align-items: center; width: 100%; max-width: 20rem; gap: .4rem; }
.napp .napp-an-form input, .napp .napp-su-form input, .napp .napp-ho-form input { width: 100%; text-align: center; }
.napp .napp-an-form .napp-co-acciones, .napp .napp-su-form .napp-co-acciones, .napp .napp-ho-form .napp-co-acciones { margin: 0; }

.napp .napp-an-resultado, .napp .napp-su-resultado, .napp .napp-ho-resultado { margin-top: 1.8rem; }

.napp .napp-an-anio {
  padding: 1.1rem 1.2rem;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: .7rem;
  background: rgba(0, 0, 0, .18);
}
.napp .napp-an-anio > .versalita {
  margin: 0 0 .7rem;
  font-size: .72rem; letter-spacing: .09em; text-transform: uppercase; opacity: .75;
}
.napp .napp-an-cab { display: flex; gap: .9rem; align-items: center; margin-bottom: .7rem; }
.napp .napp-an-cifra {
  flex: none;
  display: grid; place-items: center;
  width: 3.4rem; aspect-ratio: 1;
  border-radius: 50%;
  border: 2px solid #ffd86b;
  font-size: 1.5rem; font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.napp .napp-an-titulo { margin: 0; font-size: clamp(1.05rem, 3vw, 1.3rem); }
.napp .napp-an-ciclo { margin: .15rem 0 0; font-size: .82rem; opacity: .7; }
.napp .napp-an-texto { margin: 0 0 .6rem; line-height: 1.65; }
.napp .napp-an-prox { margin: 0; font-size: .88rem; opacity: .85; }

.napp .napp-an-meses { list-style: none; margin: 0; padding: 0; display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)); gap: .7rem; }
.napp .napp-an-mes {
  display: flex; gap: .7rem; align-items: flex-start;
  padding: .7rem .85rem;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: .55rem;
  background: rgba(0, 0, 0, .15);
}
.napp .napp-an-mnum {
  flex: none;
  display: grid; place-items: center;
  width: 2.1rem; aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, .3);
  font-variant-numeric: tabular-nums;
}
.napp .napp-an-mes .versalita { margin: 0 0 .2rem; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; opacity: .7; }
.napp .napp-an-mtxt { margin: 0; font-size: .86rem; line-height: 1.55; opacity: .92; }

.napp .napp-su-pareja { margin-top: .8rem; display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(17rem, 100%), 1fr)); gap: .8rem; }
.napp .napp-su-ficha {
  display: flex; gap: .8rem; align-items: flex-start;
  padding: .85rem .95rem;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: .6rem;
  background: rgba(0, 0, 0, .18);
}
.napp .napp-su-ficha .napp-an-cifra { width: 2.6rem; font-size: 1.15rem; border-width: 1px; border-color: rgba(255, 255, 255, .35); }
.napp .napp-su-ficha .versalita { margin: 0 0 .15rem; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; opacity: .7; }
.napp .napp-su-ficha h4 { margin: 0 0 .25rem; font-size: .98rem; }
.napp .napp-su-txt { margin: 0; font-size: .88rem; line-height: 1.6; opacity: .92; }

.napp .napp-su-chips { display: flex; flex-wrap: wrap; gap: .55rem; }
.napp .napp-su-chip {
  display: grid; place-items: center;
  min-width: 2.4rem; padding: .45rem .6rem;
  border: 1px dashed rgba(255, 216, 107, .6);
  border-radius: 2rem;
  font-size: 1.05rem; font-weight: 700; font-variant-numeric: tabular-nums;
}
.napp .napp-su-nota { margin: .7rem 0 0; font-size: .78rem; opacity: .65; line-height: 1.6; }

/* ── Compatibilidad por fecha y nombre del bebe ───────────────────────────
   Reutilizan la tarjeta grande (.napp-an-anio), las fichas pequeñas
   (.napp-su-ficha) y la barra de la compatibilidad (.napp-cp-barra). */
.napp .napp-fe .napp-intro, .napp .napp-be .napp-intro { margin: 0 auto 1.5rem; max-width: 38rem; text-align: center; }
.napp .napp-fe-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr));
  gap: 1rem;
  align-items: end;
  max-width: 40rem;
  margin: 0 auto;
}
.napp .napp-fe-form .napp-co-acciones,
.napp .napp-fe-form .napp-fe-err { grid-column: 1 / -1; text-align: center; margin: 0; }
.napp .napp-fe-form .napp-bp-persona { width: 100%; margin: 0; }
.napp .napp-fe-form input { width: 100%; text-align: center; }
/* En esta app todo el resultado va centrado: el rotulo de la barra, la barra
   misma y la cabecera de los caminos, que heredaban la alineacion izquierda
   de sus dueñas (.napp-cp-* de la compatibilidad y .napp-mx-cab de la matriz). */
.napp .napp-fe .napp-cp-rotulo { text-align: center; }
.napp .napp-fe .napp-cp-barra { max-width: 36rem; margin-left: auto; margin-right: auto; }
.napp .napp-fe .napp-mx-cab { text-align: center; }
.napp .napp-be-form {
  display: flex; flex-direction: column; align-items: center; gap: 1rem; text-align: center;
}
.napp .napp-be-form .napp-co-campo { align-items: center; width: 100%; max-width: 20rem; gap: .4rem; }
.napp .napp-be-form input { width: 100%; text-align: center; }
.napp .napp-be-form .napp-co-acciones { margin: 0; }
.napp .napp-fe-resultado, .napp .napp-be-resultado { margin-top: 1.8rem; }
.napp .napp-fe-vtitulo { margin: .9rem 0 .4rem; font-size: clamp(1.05rem, 3vw, 1.3rem); text-align: center; }
.napp .napp-fe-vtexto { margin: 0 auto; max-width: 38rem; line-height: 1.65; text-align: center; }
.napp .napp-be-eco { text-transform: capitalize; }

/* ── Colección numerológica 2026 ──────────────────────────────────────────
   Siete experiencias con una escena común y una identidad visual distinta.
   Los estilos están encerrados en .napp-signature para no alterar el resto
   de calculadoras que todavía comparten este plugin. */
.napp.napp-signature {
  --sig-accent: #e8bd66;
  --sig-accent-rgb: 232, 189, 102;
  max-width: 940px;
  color: #f5f1fb;
}
.napp-signature[data-motor="karmicas"] { --sig-accent: #78d8dc; --sig-accent-rgb: 120, 216, 220; }
.napp-signature[data-motor="anual"]    { --sig-accent: #f1c867; --sig-accent-rgb: 241, 200, 103; }
.napp-signature[data-motor="casa"]     { --sig-accent: #eaae62; --sig-accent-rgb: 234, 174, 98; }
.napp-signature[data-motor="bebe"]     { --sig-accent: #e8b3d5; --sig-accent-rgb: 232, 179, 213; }
.napp-signature[data-motor="matriz"]   { --sig-accent: #71d5c5; --sig-accent-rgb: 113, 213, 197; }
.napp-signature[data-motor="ciclos"]   { --sig-accent: #8bb6ed; --sig-accent-rgb: 139, 182, 237; }
.napp-signature[data-motor="fechas"]   { --sig-accent: #ee8ea7; --sig-accent-rgb: 238, 142, 167; }

.napp .napp-signature-shell {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(var(--sig-accent-rgb), .35);
  border-radius: clamp(1.2rem, 3vw, 1.8rem);
  background:
    radial-gradient(circle at 12% 2%, rgba(var(--sig-accent-rgb), .15), transparent 34%),
    linear-gradient(155deg, rgba(26, 20, 46, .96), rgba(6, 6, 17, .98));
  box-shadow: 0 1.6rem 4rem rgba(0, 0, 0, .32), inset 0 1px rgba(255, 255, 255, .035);
}
.napp .napp-signature-shell::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: .22;
  pointer-events: none;
  background-image:
    radial-gradient(circle at 9% 19%, #fff 0 1px, transparent 1.3px),
    radial-gradient(circle at 77% 12%, #fff 0 1px, transparent 1.3px),
    radial-gradient(circle at 93% 61%, #fff 0 1px, transparent 1.3px),
    radial-gradient(circle at 24% 84%, #fff 0 1px, transparent 1.3px);
}

.napp .napp-signature-visual {
  position: relative;
  height: clamp(12rem, 28vw, 17rem);
  margin: 0;
  overflow: hidden;
  background: #0a0915;
}
.napp .napp-signature-visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(.92) contrast(1.04) brightness(.82);
  transform: scale(1.015);
}
.napp .napp-signature-visual::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(4, 4, 13, .04) 15%, rgba(5, 5, 16, .42) 68%, #090814 100%),
    linear-gradient(90deg, rgba(var(--sig-accent-rgb), .10), transparent 38%);
  pointer-events: none;
}
.napp .napp-signature-visual figcaption {
  position: absolute;
  z-index: 1;
  left: clamp(1rem, 4vw, 2.2rem);
  bottom: clamp(1rem, 3vw, 1.6rem);
  display: flex;
  align-items: center;
  gap: .75rem;
  color: #fff;
  font-size: clamp(.72rem, 2vw, .85rem);
  font-weight: 650;
  letter-spacing: .11em;
  text-transform: uppercase;
  text-shadow: 0 2px 12px #000;
}
.napp .napp-signature-sigil {
  display: grid;
  place-items: center;
  min-width: 3.2rem;
  height: 3.2rem;
  padding: 0 .45rem;
  border: 1px solid rgba(var(--sig-accent-rgb), .74);
  border-radius: 50%;
  color: var(--sig-accent);
  background: rgba(7, 6, 18, .74);
  box-shadow: 0 0 0 5px rgba(var(--sig-accent-rgb), .08), 0 0 2rem rgba(var(--sig-accent-rgb), .22);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.05rem;
  letter-spacing: 0;
}

.napp .napp-signature-body {
  position: relative;
  z-index: 2;
  width: calc(100% - clamp(1.2rem, 4vw, 3rem));
  margin: -2.7rem auto clamp(.7rem, 2vw, 1.25rem);
  padding: clamp(1.15rem, 3.5vw, 2rem);
  border: 1px solid rgba(255, 255, 255, .10);
  border-radius: clamp(1rem, 2.5vw, 1.35rem);
  background: rgba(10, 8, 23, .91);
  box-shadow: 0 1rem 2.6rem rgba(0, 0, 0, .28), inset 0 1px rgba(255, 255, 255, .035);
  backdrop-filter: blur(14px);
}
.napp.napp-signature .napp-intro {
  max-width: 44rem;
  margin: 0 auto 1.35rem;
  color: #e9e4f3;
  font-size: clamp(.98rem, 2.3vw, 1.08rem);
  line-height: 1.65;
  text-wrap: pretty;
}

/* La entrada se percibe como una mesa de cálculo, no como campos sueltos. */
.napp.napp-signature form {
  max-width: 43rem;
  margin-left: auto;
  margin-right: auto;
  padding: clamp(.95rem, 2.8vw, 1.35rem);
  border: 1px solid rgba(var(--sig-accent-rgb), .22);
  border-radius: 1rem;
  background:
    linear-gradient(145deg, rgba(var(--sig-accent-rgb), .075), transparent 48%),
    rgba(255, 255, 255, .025);
  box-shadow: inset 0 1px rgba(255, 255, 255, .025);
}
.napp.napp-signature .napp-co-campo span {
  color: var(--sig-accent);
  font-weight: 700;
  letter-spacing: .12em;
}
.napp.napp-signature .napp-co-campo input {
  min-height: 3.15rem;
  padding: .72rem .9rem;
  border-color: rgba(255, 255, 255, .24);
  border-radius: .75rem;
  background: rgba(3, 3, 12, .7);
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .018);
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}
.napp.napp-signature .napp-co-campo input:hover { border-color: rgba(var(--sig-accent-rgb), .48); }
.napp.napp-signature .napp-co-campo input:focus-visible {
  outline: none;
  border-color: var(--sig-accent);
  background: rgba(8, 6, 21, .94);
  box-shadow: 0 0 0 3px rgba(var(--sig-accent-rgb), .15), 0 0 1.4rem rgba(var(--sig-accent-rgb), .09);
}
.napp.napp-signature input[type="date"] { color-scheme: dark; }
.napp.napp-signature .napp-btn {
  position: relative;
  min-height: 3rem;
  padding: .72rem 1.55rem;
  color: #130f1d;
  background: linear-gradient(180deg, #ffe198, var(--sig-accent));
  box-shadow: 0 .5rem 1.35rem rgba(0, 0, 0, .32), 0 0 1.5rem rgba(var(--sig-accent-rgb), .12);
}
.napp.napp-signature .napp-btn:hover {
  filter: brightness(1.06);
  transform: translateY(-1px);
}
.napp.napp-signature .napp-btn:active { transform: translateY(1px); }
.napp.napp-signature fieldset.napp-bp-persona {
  border-color: rgba(var(--sig-accent-rgb), .24);
  background: rgba(0, 0, 0, .14);
}
.napp.napp-signature fieldset.napp-bp-persona legend { color: var(--sig-accent); }

/* La explicación técnica queda disponible sin competir con la experiencia. */
.napp .napp-signature-method {
  max-width: 40rem;
  margin: 1.15rem auto 0;
  padding: .05rem 0;
  color: #9fa9ca;
  text-align: center;
}
.napp .napp-signature-method summary {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  cursor: pointer;
  color: #aeb7d5;
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  list-style: none;
}
.napp .napp-signature-method summary::-webkit-details-marker { display: none; }
.napp .napp-signature-method summary::before { content: '+'; color: var(--sig-accent); font-size: 1rem; }
.napp .napp-signature-method[open] summary::before { content: '−'; }
.napp .napp-signature-method p {
  margin: .75rem auto 0;
  font-size: .79rem;
  line-height: 1.7;
  color: #98a2c2;
  text-wrap: pretty;
}

/* Resultados con una jerarquía común y el acento propio de cada app. */
.napp.napp-signature [class$="-resultado"] {
  scroll-margin-top: 1.5rem;
  margin-top: 1.6rem;
  padding-top: 1.3rem;
  border-top: 1px solid rgba(var(--sig-accent-rgb), .25);
  animation: napp-signature-reveal .42s ease both;
}
.napp.napp-signature [class$="-resultado"]:focus { outline: none; }
.napp.napp-signature .napp-an-anio,
.napp.napp-signature .napp-mx-esencia,
.napp.napp-signature .napp-ci-tramo,
.napp.napp-signature .napp-ka-ficha,
.napp.napp-signature .napp-mx-ficha,
.napp.napp-signature .napp-su-ficha,
.napp.napp-signature .napp-an-mes {
  border-color: rgba(var(--sig-accent-rgb), .23);
  background:
    linear-gradient(135deg, rgba(var(--sig-accent-rgb), .07), transparent 48%),
    rgba(0, 0, 0, .22);
}
.napp.napp-signature .napp-an-cifra,
.napp.napp-signature .napp-ci-cifra,
.napp.napp-signature .napp-ka-cifra { border-color: var(--sig-accent); color: var(--sig-accent); }
.napp.napp-signature .napp-ka-celda.es-pasion {
  color: var(--sig-accent);
  background: rgba(var(--sig-accent-rgb), .12);
  box-shadow: inset 0 0 1.2rem rgba(var(--sig-accent-rgb), .08);
}
.napp.napp-signature .napp-ka-celda.es-falta { color: #e58da0; }
.napp.napp-signature .napp-ci-tramo.es-ahora {
  border-left-color: var(--sig-accent);
  box-shadow: 0 0 0 1px rgba(var(--sig-accent-rgb), .12), 0 .7rem 1.6rem rgba(0, 0, 0, .16);
}
.napp.napp-signature .napp-cp-relleno { background: linear-gradient(90deg, var(--sig-accent), #ffe4a4); }

.napp .napp-signature-share {
  margin: 1.25rem 0 .2rem;
  text-align: center;
}
.napp .napp-signature-share-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  min-height: 2.75rem;
  padding: .62rem 1rem;
  border: 1px solid rgba(var(--sig-accent-rgb), .5);
  border-radius: 999px;
  background: rgba(var(--sig-accent-rgb), .08);
  color: var(--sig-accent);
  cursor: pointer;
  font: inherit;
  font-size: .88rem;
  font-weight: 750;
  transition: background-color .16s ease, transform .16s ease;
}
.napp .napp-signature-share-btn:hover { background: rgba(var(--sig-accent-rgb), .15); transform: translateY(-1px); }
.napp .napp-signature-share-btn:focus-visible { outline: 2px solid var(--sig-accent); outline-offset: 3px; }
.napp .napp-signature-share-btn svg { width: 1.1rem; height: 1.1rem; fill: none; stroke: currentColor; stroke-width: 1.7; }
.napp .napp-signature-share-status {
  display: block;
  min-height: 1.2rem;
  margin-top: .4rem;
  color: #aeb7d5;
  font-size: .76rem;
}

@keyframes napp-signature-reveal {
  from { opacity: 0; transform: translateY(.65rem); }
  to { opacity: 1; transform: none; }
}

/* ── Cálculo numerológico completo: la carta principal ────────────────
   Conserva el motor y las interpretaciones históricas, pero los presenta
   como un único mapa en lugar de cuatro resultados desconectados. */
.napp.napp-signature[data-motor="completa"] {
  --sig-accent: #efc86d;
  --sig-accent-rgb: 239, 200, 109;
  max-width: 980px;
}
.napp.napp-signature[data-motor="completa"] .napp-signature-shell {
  background:
    radial-gradient(circle at 78% 9%, rgba(68, 129, 197, .16), transparent 31%),
    radial-gradient(circle at 9% 82%, rgba(95, 53, 145, .15), transparent 34%),
    linear-gradient(150deg, rgba(10, 25, 49, .98), rgba(7, 7, 19, .99));
}
.napp.napp-signature[data-motor="completa"] .napp-signature-visual img {
  object-position: center 45%;
  filter: saturate(.9) contrast(1.05) brightness(.8);
}
.napp.napp-signature[data-motor="completa"] .napp-co {
  padding: 0;
  border-radius: 0;
  background: none;
  color: #f2f4fb;
  align-items: stretch;
  gap: 1rem;
  text-align: left;
}
.napp.napp-signature[data-motor="completa"] .napp-intro {
  margin-bottom: .15rem;
  text-align: center;
}
.napp .napp-co-kicker {
  margin: 0;
  color: var(--sig-accent);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .2em;
  line-height: 1.5;
  text-align: center;
  text-transform: uppercase;
}
.napp.napp-signature[data-motor="completa"] .napp-co-form {
  max-width: 46rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .8rem .9rem;
}
.napp.napp-signature[data-motor="completa"] .napp-co-form > .napp-co-campo:nth-child(3) {
  grid-column: 1 / -1;
  width: min(100%, 22rem);
  justify-self: center;
}
.napp .napp-co-privacidad {
  grid-column: 1 / -1;
  margin: -.1rem 0 0;
  color: #929db9;
  font-size: .73rem;
  letter-spacing: .025em;
  text-align: center;
}
.napp .napp-co-privacidad::before {
  content: '◇';
  margin-right: .35rem;
  color: var(--sig-accent);
}

.napp.napp-signature[data-motor="completa"] .napp-co-resultado {
  display: block;
  width: 100%;
}
.napp .napp-co-mapa-cab {
  max-width: 42rem;
  margin: 0 auto 1.15rem;
  text-align: center;
}
.napp .napp-co-mapa-cab h2 {
  margin: .3rem 0 .45rem;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.55rem, 4vw, 2.25rem);
  font-weight: 500;
  line-height: 1.08;
  text-wrap: balance;
}
.napp .napp-co-codigo {
  display: inline-flex;
  align-items: baseline;
  gap: .55rem;
  margin: 0;
  color: #aeb8d2;
  font-size: .76rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.napp .napp-co-codigo strong {
  color: var(--sig-accent);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.1rem, 3vw, 1.4rem);
  font-weight: 500;
  letter-spacing: .12em;
}

.napp .napp-co-mapa {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .7rem;
  max-width: 51rem;
  margin: 0 auto;
  padding: 1rem;
  border: 1px solid rgba(var(--sig-accent-rgb), .2);
  border-radius: 1.35rem;
  background:
    radial-gradient(circle at 50% 48%, rgba(var(--sig-accent-rgb), .1), transparent 35%),
    linear-gradient(145deg, rgba(15, 34, 61, .75), rgba(6, 7, 18, .78));
  overflow: hidden;
}
.napp .napp-co-mapa::before,
.napp .napp-co-mapa::after {
  content: '';
  position: absolute;
  pointer-events: none;
}
.napp .napp-co-mapa::before {
  inset: 17% 6%;
  border-top: 1px solid rgba(var(--sig-accent-rgb), .17);
  border-bottom: 1px solid rgba(var(--sig-accent-rgb), .11);
  transform: skewY(-4deg);
}
.napp .napp-co-mapa::after {
  inset: 0;
  opacity: .24;
  background-image:
    radial-gradient(circle at 8% 18%, #fff 0 1px, transparent 1.3px),
    radial-gradient(circle at 68% 11%, #fff 0 1px, transparent 1.3px),
    radial-gradient(circle at 91% 77%, #fff 0 1px, transparent 1.3px),
    radial-gradient(circle at 27% 84%, #fff 0 1px, transparent 1.3px);
}
.napp .napp-co-nodo {
  position: relative;
  z-index: 1;
  min-width: 0;
  padding: .8rem .35rem .75rem;
  text-align: center;
}
.napp .napp-co-nodo-numero,
.napp .napp-co-medallon {
  display: grid;
  place-items: center;
  width: 4.35rem;
  height: 4.35rem;
  border: 1px solid rgba(var(--sig-accent-rgb), .8);
  border-radius: 50%;
  color: #ffe49b;
  background:
    radial-gradient(circle at 38% 30%, rgba(255, 255, 255, .12), transparent 30%),
    rgba(9, 18, 36, .93);
  box-shadow: 0 0 0 .35rem rgba(var(--sig-accent-rgb), .055), 0 .55rem 1.5rem rgba(0, 0, 0, .32);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 2rem;
  font-variant-numeric: tabular-nums;
}
.napp .napp-co-nodo-numero { margin: 0 auto .72rem; }
.napp .napp-co-nodo-rotulo {
  display: block;
  color: #f1f3fa;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .08em;
  line-height: 1.35;
  text-transform: uppercase;
}
.napp .napp-co-nodo-clave {
  display: block;
  margin-top: .25rem;
  color: #9ba8c5;
  font-family: Georgia, "Times New Roman", serif;
  font-size: .84rem;
  font-style: italic;
  line-height: 1.25;
}

.napp .napp-co-sintesis {
  max-width: 46rem;
  margin: 1rem auto 1.45rem;
  padding: clamp(1rem, 3vw, 1.45rem);
  border-left: 2px solid var(--sig-accent);
  border-radius: .25rem 1rem 1rem .25rem;
  background: linear-gradient(100deg, rgba(var(--sig-accent-rgb), .09), rgba(255, 255, 255, .025));
}
.napp .napp-co-sintesis .napp-co-kicker { text-align: left; }
.napp .napp-co-sintesis h3 {
  margin: .25rem 0 .7rem;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.25rem, 3.5vw, 1.6rem);
  font-weight: 500;
}
.napp .napp-co-sintesis-texto {
  color: #d8deed;
  line-height: 1.65;
}
.napp .napp-co-sintesis-texto p { margin: .55rem 0 0; }
.napp .napp-co-sintesis-texto p:first-child { margin-top: 0; }
.napp .napp-co-lecturas-titulo {
  margin: 0 0 .8rem;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.25rem, 3vw, 1.55rem);
  font-weight: 500;
  text-align: center;
}
.napp .napp-co-lecturas {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
}
.napp.napp-signature[data-motor="completa"] .napp-co-bloque {
  min-width: 0;
  padding: clamp(.9rem, 2.5vw, 1.15rem);
  border-color: rgba(var(--sig-accent-rgb), .18);
  border-radius: 1rem;
  background:
    linear-gradient(145deg, rgba(50, 92, 137, .085), transparent 48%),
    rgba(0, 0, 0, .22);
  box-shadow: inset 0 1px rgba(255, 255, 255, .025);
}
.napp.napp-signature[data-motor="completa"] .napp-co-cab { align-items: center; }
.napp .napp-co-medallon {
  width: 3.65rem;
  height: 3.65rem;
  flex: none;
  font-size: 1.6rem;
  box-shadow: 0 0 0 .25rem rgba(var(--sig-accent-rgb), .04), 0 .4rem 1rem rgba(0, 0, 0, .28);
}
.napp.napp-signature[data-motor="completa"] .napp-co-rotulo { color: #aab5ce; }
.napp.napp-signature[data-motor="completa"] .napp-co-origen { color: #7f8daa; }
.napp.napp-signature[data-motor="completa"] .napp-co-titulo {
  color: #ffe29a;
  font-size: clamp(1.05rem, 3vw, 1.25rem);
}
.napp.napp-signature[data-motor="completa"] .napp-co-texto {
  color: #dce2ef;
  line-height: 1.65;
}
.napp.napp-signature[data-motor="completa"] .napp-co-calculo summary {
  color: #aeb8d1;
  font-weight: 700;
}
.napp.napp-signature[data-motor="completa"] .napp-co-calculo summary:hover { color: var(--sig-accent); }
.napp .napp-co-reiniciar-wrap { margin: 1.15rem 0 0; text-align: center; }
.napp .napp-co-reiniciar {
  padding: .55rem .9rem;
  border: 0;
  border-bottom: 1px solid rgba(var(--sig-accent-rgb), .55);
  background: none;
  color: #bac4da;
  cursor: pointer;
  font: inherit;
  font-size: .83rem;
}
.napp .napp-co-reiniciar:hover { color: var(--sig-accent); }
.napp .napp-co-reiniciar:focus-visible { outline: 2px solid var(--sig-accent); outline-offset: 3px; }

/* ── Compatibilidad numerológica: dos energías y un tercer vínculo ───
   El azul y el coral nacen de la propia imagen de portada. La antigua
   sucesión de dos PNG y una barra se convierte en una lectura relacional. */
.napp.napp-signature[data-motor="compatibilidad"] {
  --sig-accent: #efc777;
  --sig-accent-rgb: 239, 199, 119;
  --cp-blue: #77d5e7;
  --cp-blue-rgb: 119, 213, 231;
  --cp-coral: #f29a9c;
  --cp-coral-rgb: 242, 154, 156;
  max-width: 980px;
}
.napp.napp-signature[data-motor="compatibilidad"] .napp-signature-shell {
  background:
    radial-gradient(circle at 8% 20%, rgba(var(--cp-blue-rgb), .13), transparent 31%),
    radial-gradient(circle at 92% 78%, rgba(var(--cp-coral-rgb), .13), transparent 33%),
    linear-gradient(150deg, rgba(7, 31, 51, .98), rgba(12, 8, 27, .99) 52%, rgba(45, 19, 27, .98));
}
.napp.napp-signature[data-motor="compatibilidad"] .napp-signature-visual img {
  object-position: center 48%;
  filter: saturate(.96) contrast(1.07) brightness(.82);
}
.napp.napp-signature[data-motor="compatibilidad"] .napp-cp {
  width: 100%;
  padding: 0;
  border-radius: 0;
  background: none;
  color: #f5f2fa;
  align-items: stretch;
  gap: .9rem;
  text-align: left;
}
.napp.napp-signature[data-motor="compatibilidad"] .napp-cp-kicker,
.napp.napp-signature[data-motor="compatibilidad"] .napp-intro { text-align: center; }
.napp.napp-signature[data-motor="compatibilidad"] .napp-intro { margin-bottom: .15rem; }
.napp.napp-signature[data-motor="compatibilidad"] .napp-cp-form {
  display: grid;
  grid-template-columns: 1fr;
  width: 100%;
  max-width: 46rem;
  gap: .85rem;
  text-align: left;
}
.napp .napp-cp-nombres {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: .75rem;
  align-items: end;
}
.napp .napp-cp-campo { min-width: 0; }
.napp .napp-cp-campo input { width: 100%; }
.napp.napp-signature[data-motor="compatibilidad"] .napp-cp-campo-a span { color: var(--cp-blue); }
.napp.napp-signature[data-motor="compatibilidad"] .napp-cp-campo-b span { color: var(--cp-coral); }
.napp .napp-cp-infinito {
  display: grid;
  place-items: center;
  width: 2.8rem;
  height: 3.15rem;
  color: var(--sig-accent);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.75rem;
  text-shadow: 0 0 1.2rem rgba(var(--sig-accent-rgb), .32);
}
.napp .napp-cp-tipo {
  min-width: 0;
  margin: .15rem 0 0;
  padding: .8rem .8rem .75rem;
  border: 1px solid rgba(255, 255, 255, .10);
  border-radius: .85rem;
  background: rgba(0, 0, 0, .13);
}
.napp .napp-cp-tipo legend {
  padding: 0 .4rem;
  color: #aeb8cf;
  font-size: .73rem;
  font-weight: 750;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.napp .napp-cp-opciones { display: flex; flex-wrap: wrap; justify-content: center; gap: .45rem; }
.napp .napp-cp-opciones label { position: relative; cursor: pointer; }
.napp .napp-cp-opciones input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}
.napp .napp-cp-opciones span {
  display: block;
  min-width: 6.3rem;
  padding: .55rem .8rem;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 999px;
  background: rgba(255, 255, 255, .025);
  color: #c6cede;
  font-size: .86rem;
  font-weight: 720;
  text-align: center;
  transition: border-color .16s ease, background-color .16s ease, color .16s ease, transform .16s ease;
}
.napp .napp-cp-opciones label:hover span { border-color: rgba(var(--sig-accent-rgb), .5); color: #fff; }
.napp .napp-cp-opciones input:checked + span {
  border-color: rgba(var(--sig-accent-rgb), .78);
  background: rgba(var(--sig-accent-rgb), .13);
  color: #ffe4a7;
  box-shadow: inset 0 0 1.1rem rgba(var(--sig-accent-rgb), .05);
}
.napp .napp-cp-opciones input:focus-visible + span { outline: 2px solid var(--sig-accent); outline-offset: 3px; }
.napp .napp-cp-form .napp-co-acciones,
.napp .napp-cp-form .napp-cp-err,
.napp .napp-cp-form .napp-cp-privacidad { grid-column: 1 / -1; text-align: center; }
.napp .napp-cp-form .napp-co-acciones { margin: .1rem 0 0; }
.napp .napp-cp-form .napp-cp-err { margin: 0; }

.napp.napp-signature[data-motor="compatibilidad"] .napp-cp-resultado {
  display: block;
  width: 100%;
  color: #edf1f8;
}
.napp .napp-cp-cabecera {
  max-width: 46rem;
  margin: 0 auto 1.1rem;
  text-align: center;
}
.napp .napp-cp-cabecera h2 {
  margin: .3rem 0 .45rem;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.55rem, 4vw, 2.35rem);
  font-weight: 500;
  line-height: 1.08;
  text-wrap: balance;
}
.napp .napp-cp-codigo {
  display: inline-flex;
  align-items: baseline;
  gap: .55rem;
  margin: 0;
  color: #aab4ca;
  font-size: .72rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.napp .napp-cp-codigo strong {
  color: var(--sig-accent);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.15rem;
  font-weight: 500;
  letter-spacing: .16em;
}
.napp.napp-signature[data-motor="compatibilidad"] .napp-cp-pareja {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(8rem, .55fr) minmax(0, 1fr);
  align-items: stretch;
  gap: .75rem;
  max-width: 55rem;
  margin: 0 auto 1.15rem;
}
.napp .napp-cp-persona {
  min-width: 0;
  padding: 1.1rem 1rem;
  border: 1px solid rgba(255, 255, 255, .11);
  border-radius: 1.1rem;
  background: rgba(0, 0, 0, .22);
  text-align: center;
  box-shadow: inset 0 1px rgba(255, 255, 255, .025);
}
.napp .napp-cp-persona-a {
  border-color: rgba(var(--cp-blue-rgb), .3);
  background: linear-gradient(145deg, rgba(var(--cp-blue-rgb), .09), transparent 55%), rgba(0, 0, 0, .2);
}
.napp .napp-cp-persona-b {
  border-color: rgba(var(--cp-coral-rgb), .3);
  background: linear-gradient(215deg, rgba(var(--cp-coral-rgb), .09), transparent 55%), rgba(0, 0, 0, .2);
}
.napp .napp-cp-persona-nombre {
  min-height: 1.35rem;
  margin: 0 0 .65rem;
  overflow-wrap: anywhere;
  color: #f6f7fb;
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.napp .napp-cp-medallon {
  display: grid;
  place-items: center;
  width: 4.65rem;
  height: 4.65rem;
  margin: 0 auto .7rem;
  border: 1px solid currentColor;
  border-radius: 50%;
  background: radial-gradient(circle at 36% 28%, rgba(255, 255, 255, .15), transparent 29%), rgba(4, 12, 24, .78);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 2.1rem;
  font-variant-numeric: tabular-nums;
}
.napp .napp-cp-persona-a .napp-cp-medallon {
  color: var(--cp-blue);
  box-shadow: 0 0 0 .38rem rgba(var(--cp-blue-rgb), .055), 0 0 1.7rem rgba(var(--cp-blue-rgb), .15);
}
.napp .napp-cp-persona-b .napp-cp-medallon {
  color: var(--cp-coral);
  box-shadow: 0 0 0 .38rem rgba(var(--cp-coral-rgb), .055), 0 0 1.7rem rgba(var(--cp-coral-rgb), .15);
}
.napp .napp-cp-persona h3 {
  min-height: 2.6rem;
  margin: 0 0 .75rem;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.1rem;
  font-weight: 500;
  line-height: 1.2;
}
.napp .napp-cp-persona dl { margin: 0; text-align: left; }
.napp .napp-cp-persona dl div + div { margin-top: .7rem; padding-top: .7rem; border-top: 1px solid rgba(255, 255, 255, .07); }
.napp .napp-cp-persona dt {
  margin: 0 0 .24rem;
  color: #98a5bf;
  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.napp .napp-cp-persona dd { margin: 0; color: #d6dce8; font-size: .83rem; line-height: 1.52; }
.napp .napp-cp-centro {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  padding: .9rem .5rem;
  text-align: center;
}
.napp .napp-cp-centro::before,
.napp .napp-cp-centro::after {
  content: '';
  position: absolute;
  top: 50%;
  width: 25%;
  border-top: 1px solid rgba(var(--sig-accent-rgb), .38);
}
.napp .napp-cp-centro::before { left: 0; }
.napp .napp-cp-centro::after { right: 0; }
.napp .napp-cp-lazo { color: var(--sig-accent); font-family: Georgia, "Times New Roman", serif; font-size: 2.5rem; line-height: 1; }
.napp .napp-cp-centro p {
  margin: .45rem 0 .3rem;
  color: #aab4ca;
  font-size: .63rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.napp .napp-cp-vnum {
  display: grid;
  place-items: center;
  width: 3.4rem;
  height: 3.4rem;
  border: 1px solid rgba(var(--sig-accent-rgb), .7);
  border-radius: 50%;
  color: #ffe1a0;
  background: #0c0a17;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.6rem;
  font-weight: 500;
  box-shadow: 0 0 1.5rem rgba(var(--sig-accent-rgb), .13);
}
.napp .napp-cp-vtitulo { margin-top: .45rem; color: #b5bdd1; font-family: Georgia, "Times New Roman", serif; font-size: .8rem; line-height: 1.25; }

.napp.napp-signature[data-motor="compatibilidad"] .napp-cp-rotulo {
  margin: 0 0 .5rem;
  color: #bdc5d7;
  text-align: center;
}
.napp.napp-signature[data-motor="compatibilidad"] .napp-cp-barra {
  width: min(100%, 38rem);
  margin: 0 auto;
  border-color: rgba(var(--sig-accent-rgb), .28);
  background: rgba(0, 0, 0, .5);
}
.napp.napp-signature[data-motor="compatibilidad"] .napp-cp-relleno {
  background: linear-gradient(90deg, var(--cp-blue), var(--sig-accent) 52%, var(--cp-coral));
}
.napp .napp-cp-simbolica { max-width: 35rem; margin: .5rem auto 1.35rem; color: #8f9ab2; font-size: .72rem; line-height: 1.5; text-align: center; }
.napp .napp-cp-lectura {
  max-width: 55rem;
  margin: 0 auto;
  padding: clamp(1rem, 3vw, 1.4rem);
  border: 1px solid rgba(var(--sig-accent-rgb), .2);
  border-radius: 1.2rem;
  background:
    radial-gradient(circle at 50% 0, rgba(var(--sig-accent-rgb), .09), transparent 33%),
    rgba(0, 0, 0, .19);
}
.napp .napp-cp-lectura > h3 {
  margin: .3rem 0 1rem;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.35rem, 3.5vw, 1.85rem);
  font-weight: 500;
  line-height: 1.15;
  text-align: center;
  text-wrap: balance;
}
.napp .napp-cp-claves { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .7rem; }
.napp .napp-cp-claves article {
  min-width: 0;
  padding: .9rem;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: .85rem;
  background: rgba(255, 255, 255, .025);
}
.napp .napp-cp-claves article > span { color: var(--sig-accent); font-size: 1.1rem; }
.napp .napp-cp-claves h4 { margin: .35rem 0 .45rem; color: #f2f3f8; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.napp .napp-cp-claves p { margin: 0; color: #cdd3df; font-size: .84rem; line-height: 1.58; }
.napp .napp-cp-contexto {
  margin-top: .8rem;
  padding: .85rem 1rem;
  border-left: 2px solid var(--sig-accent);
  border-radius: .15rem .75rem .75rem .15rem;
  background: linear-gradient(90deg, rgba(var(--sig-accent-rgb), .08), transparent);
}
.napp .napp-cp-contexto strong { display: block; margin-bottom: .3rem; color: #ffe1a0; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; }
.napp .napp-cp-contexto p { margin: 0; color: #d7dce7; font-size: .88rem; line-height: 1.62; }
.napp .napp-cp-vinculo {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1rem;
  align-items: center;
  max-width: 46rem;
  margin: 1rem auto 0;
  padding: 1rem 1.1rem;
  border: 1px solid rgba(var(--sig-accent-rgb), .16);
  border-radius: 1rem;
  background: linear-gradient(120deg, rgba(var(--sig-accent-rgb), .075), rgba(255, 255, 255, .018));
}
.napp .napp-cp-vinculo-num {
  display: grid;
  place-items: center;
  width: 4.25rem;
  height: 4.25rem;
  border: 1px solid rgba(var(--sig-accent-rgb), .65);
  border-radius: 50%;
  color: var(--sig-accent);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.9rem;
}
.napp .napp-cp-vinculo .napp-co-kicker { text-align: left; }
.napp .napp-cp-vinculo h3 { margin: .2rem 0 .35rem; color: #fff; font-family: Georgia, "Times New Roman", serif; font-size: 1.15rem; font-weight: 500; }
.napp .napp-cp-vinculo p:last-child { margin: 0; color: #cbd2df; font-size: .86rem; line-height: 1.55; }
.napp .napp-cp-calculo { max-width: 46rem; margin: 1rem auto 0; }
.napp .napp-cp-calculo > summary {
  cursor: pointer;
  color: #adb7cd;
  font-size: .78rem;
  font-weight: 750;
  text-align: center;
}
.napp .napp-cp-calculo > summary:hover { color: var(--sig-accent); }
.napp .napp-cp-calculos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin-top: .75rem; }
.napp .napp-cp-calculos section { min-width: 0; padding: .8rem; border: 1px solid rgba(255, 255, 255, .08); border-radius: .8rem; background: rgba(0, 0, 0, .16); }
.napp .napp-cp-calculos h4 { margin: 0 0 .55rem; color: #fff; font-family: Georgia, "Times New Roman", serif; font-size: 1rem; font-weight: 500; overflow-wrap: anywhere; }
.napp .napp-cp-calculos p { margin: .4rem 0 0; color: #bbc4d5; font-size: .78rem; line-height: 1.8; }
.napp .napp-cp-calculos [class*="napp-cp-letras"] { line-height: 2.1; }
.napp .napp-cp-reiniciar-wrap { margin: 1rem 0 0; text-align: center; }
.napp .napp-cp-reiniciar {
  padding: .55rem .9rem;
  border: 0;
  border-bottom: 1px solid rgba(var(--sig-accent-rgb), .55);
  background: none;
  color: #bac4da;
  cursor: pointer;
  font: inherit;
  font-size: .83rem;
}
.napp .napp-cp-reiniciar:hover { color: var(--sig-accent); }
.napp .napp-cp-reiniciar:focus-visible { outline: 2px solid var(--sig-accent); outline-offset: 3px; }

/* En escritorio, antes de calcular, imagen y formulario se miran de frente:
   la acción principal queda a la vista sin renunciar a la portada. Al aparecer
   el resultado la escena vuelve a una sola columna para dar aire a la lectura. */
@media (min-width: 761px) {
  .napp.napp-signature:not(.has-result) .napp-signature-shell {
    display: grid;
    grid-template-columns: minmax(15rem, 32%) minmax(0, 1fr);
    align-items: stretch;
    padding: .8rem;
  }
  .napp.napp-signature:not(.has-result) .napp-signature-visual {
    height: auto;
    min-height: 27rem;
    border-radius: 1.15rem;
  }
  .napp.napp-signature:not(.has-result) .napp-signature-visual figcaption {
    right: 1.15rem;
    bottom: 1.15rem;
    left: 1.15rem;
    flex-direction: column;
    align-items: flex-start;
    line-height: 1.55;
  }
  .napp.napp-signature:not(.has-result) .napp-signature-body {
    align-self: center;
    width: auto;
    margin: 0;
    padding: clamp(1.15rem, 3vw, 2rem);
    border: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
  }
  .napp.napp-signature.has-result .napp-signature-visual { height: 10rem; }
  .napp.napp-signature.has-result .napp-signature-body { margin-top: -1.45rem; }
}

@media (max-width: 620px) {
  .napp .napp-signature-visual { height: 12.2rem; }
  .napp .napp-signature-visual figcaption {
    right: 1rem;
    bottom: 2.15rem;
    align-items: flex-end;
  }
  .napp .napp-signature-sigil { min-width: 2.75rem; height: 2.75rem; font-size: .92rem; }
  .napp .napp-signature-body {
    width: calc(100% - 1rem);
    margin-top: -1.75rem;
    padding: 1rem .75rem 1.2rem;
  }
  .napp.napp-signature form { padding: .85rem .7rem; }
  .napp.napp-signature .napp-btn { width: 100%; max-width: 19rem; }
  .napp.napp-signature .napp-fe-form { grid-template-columns: 1fr; }
  .napp.napp-signature .napp-mx-ecab { align-items: flex-start; }
  .napp.napp-signature[data-motor="completa"] .napp-co-form { grid-template-columns: 1fr; }
  .napp.napp-signature[data-motor="completa"] .napp-co-form > .napp-co-campo:nth-child(3) { grid-column: auto; width: 100%; }
  .napp .napp-co-mapa { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: .65rem .35rem; }
  .napp .napp-co-nodo { padding: .7rem .2rem; }
  .napp .napp-co-nodo-numero { width: 3.8rem; height: 3.8rem; font-size: 1.7rem; }
  .napp .napp-co-lecturas { grid-template-columns: 1fr; }
  .napp.napp-signature[data-motor="completa"] .napp-co-bloque { padding: .9rem .75rem; }
  .napp .napp-cp-nombres { grid-template-columns: 1fr; gap: .6rem; }
  .napp .napp-cp-infinito { width: 100%; height: 1.4rem; transform: rotate(90deg); }
  .napp .napp-cp-opciones { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .napp .napp-cp-opciones span { min-width: 0; padding: .5rem .35rem; }
  .napp.napp-signature[data-motor="compatibilidad"] .napp-cp-pareja { grid-template-columns: 1fr; }
  .napp .napp-cp-centro { min-height: 8rem; }
  .napp .napp-cp-centro::before,
  .napp .napp-cp-centro::after { top: 50%; width: 30%; }
  .napp .napp-cp-claves,
  .napp .napp-cp-calculos { grid-template-columns: 1fr; }
  .napp .napp-cp-vinculo { grid-template-columns: 1fr; text-align: center; }
  .napp .napp-cp-vinculo-num { margin: 0 auto; }
  .napp .napp-cp-vinculo .napp-co-kicker { text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  .napp.napp-signature [class$="-resultado"] { animation: none; }
  .napp.napp-signature .napp-btn,
  .napp .napp-signature-share-btn,
  .napp.napp-signature .napp-co-campo input,
  .napp .napp-cp-opciones span,
  .napp .napp-cp-relleno { transition: none; }
}

/* ── Calculadora numerológica: una palabra convertida en símbolo ────────
   La cifra deja de depender de los PNG antiguos: el medallón es tipografía
   nítida y la imagen social de la propia página se convierte en su portada. */
.napp.napp-signature[data-motor="calculadora"] {
  --sig-accent: #f0c45e;
  --sig-accent-rgb: 240, 196, 94;
  max-width: 980px;
}
.napp.napp-signature[data-motor="calculadora"] .napp-signature-shell {
  background:
    radial-gradient(circle at 82% 9%, rgba(65, 142, 203, .18), transparent 31%),
    radial-gradient(circle at 7% 82%, rgba(var(--sig-accent-rgb), .11), transparent 34%),
    linear-gradient(150deg, rgba(7, 28, 54, .99), rgba(7, 9, 24, .99) 58%, rgba(20, 12, 43, .98));
}
.napp.napp-signature[data-motor="calculadora"] .napp-signature-visual img {
  object-position: center 50%;
  filter: saturate(.9) contrast(1.06) brightness(.79);
}
.napp.napp-signature[data-motor="calculadora"] .napp-ca {
  width: 100%;
  padding: 0;
  border-radius: 0;
  background: none;
  color: #f4f0f8;
  align-items: stretch;
  gap: .95rem;
  text-align: left;
}
.napp .napp-ca-kicker {
  margin: 0;
  color: var(--sig-accent);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .2em;
  line-height: 1.5;
  text-align: center;
  text-transform: uppercase;
}
.napp.napp-signature[data-motor="calculadora"] .napp-intro {
  margin-bottom: .15rem;
  text-align: center;
}
.napp.napp-signature[data-motor="calculadora"] .napp-ca-form {
  width: 100%;
  max-width: 46rem;
  align-items: stretch;
  gap: .85rem;
}
.napp.napp-signature[data-motor="calculadora"] .napp-ca-campo {
  display: block;
  width: 100%;
}
.napp .napp-ca-campo-label {
  display: block;
  margin: 0 0 .38rem;
  color: var(--sig-accent);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .11em;
  text-align: left;
  text-transform: uppercase;
}
.napp.napp-signature[data-motor="calculadora"] .napp-ca-input {
  min-height: 3.2rem;
  padding: .72rem 3.5rem .72rem .95rem;
  border-color: rgba(255, 255, 255, .25);
  border-radius: .78rem;
  background: rgba(3, 4, 14, .72);
  text-align: left;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .018);
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}
.napp.napp-signature[data-motor="calculadora"] .napp-ca-input:hover { border-color: rgba(var(--sig-accent-rgb), .48); }
.napp.napp-signature[data-motor="calculadora"] .napp-ca-input:focus-visible {
  outline: none;
  border-color: var(--sig-accent);
  background: rgba(8, 7, 22, .95);
  box-shadow: 0 0 0 3px rgba(var(--sig-accent-rgb), .15), 0 0 1.4rem rgba(var(--sig-accent-rgb), .09);
}
.napp.napp-signature[data-motor="calculadora"] .napp-ca-restantes {
  top: auto;
  right: .9rem;
  bottom: .92rem;
  translate: none;
  color: #8e99b3;
}
.napp.napp-signature[data-motor="calculadora"] .napp-ca-alfabetos {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem;
  padding: .8rem;
  border-color: rgba(var(--sig-accent-rgb), .2);
  border-radius: 1rem;
  background: rgba(0, 0, 0, .13);
}
.napp.napp-signature[data-motor="calculadora"] .napp-ca-alfabetos legend { color: var(--sig-accent); }
.napp .napp-ca-opcion {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: .65rem;
  min-width: 0;
  padding: .72rem;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: .8rem;
  background: rgba(255, 255, 255, .025);
  cursor: pointer;
  transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease;
}
.napp .napp-ca-opcion:hover { border-color: rgba(var(--sig-accent-rgb), .42); }
.napp .napp-ca-opcion:has(input:checked) {
  border-color: rgba(var(--sig-accent-rgb), .72);
  background: rgba(var(--sig-accent-rgb), .09);
  box-shadow: inset 0 0 1.2rem rgba(var(--sig-accent-rgb), .04);
}
.napp .napp-ca-opcion input { margin: .18rem 0 0; accent-color: var(--sig-accent); }
.napp .napp-ca-opcion span { min-width: 0; }
.napp .napp-ca-opcion b { display: block; color: #f5f1fa; font-size: .9rem; line-height: 1.25; }
.napp .napp-ca-opcion small { display: block; margin-top: .24rem; color: #909bb4; font-size: .72rem; line-height: 1.42; }
.napp.napp-signature[data-motor="calculadora"] .napp-ca-tabla-btn {
  justify-self: center;
  color: #d8cda9;
  border-color: rgba(var(--sig-accent-rgb), .38);
  padding: .28rem .8rem;
}
.napp.napp-signature[data-motor="calculadora"] .napp-ca-tabla-btn:hover { color: var(--sig-accent); background: rgba(var(--sig-accent-rgb), .07); }
.napp.napp-signature[data-motor="calculadora"] .napp-ca-tabla {
  max-width: none;
  padding: .2rem 0;
}
.napp.napp-signature[data-motor="calculadora"] .napp-ca-tabla table {
  min-width: 31rem;
  color: #dce1ee;
  background: rgba(0, 0, 0, .18);
}
.napp.napp-signature[data-motor="calculadora"] .napp-ca-tabla th { color: var(--sig-accent); background: rgba(var(--sig-accent-rgb), .1); }
.napp.napp-signature[data-motor="calculadora"] .napp-ca-go { align-self: center; }
.napp .napp-ca-privacidad {
  margin: -.15rem 0 0;
  color: #8f9ab3;
  font-size: .72rem;
  line-height: 1.5;
  text-align: center;
}
.napp .napp-ca-privacidad::before { content: '◇'; margin-right: .35rem; color: var(--sig-accent); }
.napp.napp-signature[data-motor="calculadora"] .napp-ca-err { margin: 0; text-align: center; }

.napp.napp-signature[data-motor="calculadora"] .napp-ca-resultado {
  display: block;
  width: 100%;
  color: #eef1f7;
}
.napp .napp-ca-cabecera {
  max-width: 44rem;
  margin: 0 auto 1.1rem;
  text-align: center;
}
.napp .napp-ca-consulta {
  margin: .35rem 0 .8rem;
  color: #a7b2c8;
  font-family: Georgia, "Times New Roman", serif;
  font-size: .92rem;
  font-style: italic;
  overflow-wrap: anywhere;
}
.napp .napp-ca-medallon {
  position: relative;
  display: grid;
  place-items: center;
  width: clamp(6.2rem, 20vw, 8.2rem);
  aspect-ratio: 1;
  margin: .4rem auto .75rem;
  border: 1px solid rgba(var(--sig-accent-rgb), .9);
  border-radius: 50%;
  color: #ffe69c;
  background:
    radial-gradient(circle at 38% 30%, rgba(255, 255, 255, .16), transparent 25%),
    radial-gradient(circle, rgba(27, 74, 111, .78), rgba(7, 12, 29, .98) 68%);
  box-shadow: 0 0 0 .5rem rgba(var(--sig-accent-rgb), .055), 0 0 3rem rgba(65, 154, 208, .2), 0 .8rem 2rem rgba(0, 0, 0, .38);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(3rem, 10vw, 4.5rem);
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.napp .napp-ca-medallon::before,
.napp .napp-ca-medallon::after {
  content: '';
  position: absolute;
  border: 1px solid rgba(var(--sig-accent-rgb), .16);
  border-radius: 50%;
  pointer-events: none;
}
.napp .napp-ca-medallon::before { inset: -.72rem; }
.napp .napp-ca-medallon::after { inset: .55rem; border-color: rgba(255, 255, 255, .08); }
.napp.napp-signature[data-motor="calculadora"] .napp-ca-titulo {
  margin: 0;
  color: #fff;
  font-size: clamp(1.6rem, 4.5vw, 2.25rem);
  font-weight: 500;
  line-height: 1.08;
  text-wrap: balance;
}
.napp .napp-ca-cabecera .napp-ca-sig {
  max-width: 41rem;
  margin: .8rem auto 0;
  color: #d9deea;
  font-size: clamp(.98rem, 2.4vw, 1.08rem);
  line-height: 1.72;
  text-wrap: pretty;
}
.napp.napp-signature[data-motor="calculadora"] .napp-ca-desglose,
.napp.napp-signature[data-motor="calculadora"] .napp-ca-textos,
.napp.napp-signature[data-motor="calculadora"] .napp-ca-corresp {
  max-width: 51rem;
  margin: .8rem auto 0;
  padding: clamp(.9rem, 2.7vw, 1.25rem);
  border-color: rgba(var(--sig-accent-rgb), .18);
  border-radius: 1rem;
  background:
    linear-gradient(145deg, rgba(var(--sig-accent-rgb), .055), transparent 46%),
    rgba(0, 0, 0, .22);
}
.napp.napp-signature[data-motor="calculadora"] .napp-ca h3 {
  margin: 0 0 .5rem;
  color: var(--sig-accent);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .15em;
  line-height: 1.4;
  text-transform: uppercase;
}
.napp.napp-signature[data-motor="calculadora"] .napp-ca-cua { color: #eef1f7; font-family: Georgia, "Times New Roman", serif; font-size: 1.02rem; }
.napp.napp-signature[data-motor="calculadora"] .napp-ca-caras { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 1rem; gap: .75rem; }
.napp .napp-ca-caras article {
  min-width: 0;
  padding: .9rem;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: .85rem;
  background: rgba(255, 255, 255, .025);
}
.napp .napp-ca-caras article:first-child { border-color: rgba(106, 218, 162, .22); }
.napp .napp-ca-caras article:last-child { border-color: rgba(221, 132, 155, .22); }
.napp.napp-signature[data-motor="calculadora"] .napp-ca-pos,
.napp.napp-signature[data-motor="calculadora"] .napp-ca-neg { color: #d8deea; line-height: 1.65; }
.napp .napp-ca-consejo {
  max-width: 47rem;
  margin: .9rem auto 0;
  padding: 1rem 1.1rem;
  border-left: 2px solid var(--sig-accent);
  border-radius: .2rem .9rem .9rem .2rem;
  background: linear-gradient(100deg, rgba(var(--sig-accent-rgb), .1), rgba(255, 255, 255, .025));
}
.napp .napp-ca-consejo p { color: #dce1ec; line-height: 1.68; }
.napp.napp-signature[data-motor="calculadora"] .napp-ca-lista { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .55rem; }
.napp.napp-signature[data-motor="calculadora"] .napp-ca-lista div {
  display: block;
  min-width: 0;
  padding: .65rem .7rem;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: .7rem;
  background: rgba(255, 255, 255, .025);
}
.napp.napp-signature[data-motor="calculadora"] .napp-ca-lista dt { color: #8f9bb6; font-size: .68rem; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; }
.napp.napp-signature[data-motor="calculadora"] .napp-ca-lista dd { margin: .22rem 0 0; color: #f2f0ec; text-align: left; overflow-wrap: anywhere; }
.napp .napp-ca-reset-wrap { margin: 1rem 0 0; text-align: center; }
.napp .napp-ca-reset {
  padding: .5rem .8rem;
  border: 0;
  border-bottom: 1px solid rgba(var(--sig-accent-rgb), .5);
  background: none;
  color: #aeb9cf;
  cursor: pointer;
  font: inherit;
  font-size: .82rem;
}
.napp .napp-ca-reset:hover { color: var(--sig-accent); }
.napp .napp-ca-reset:focus-visible { outline: 2px solid var(--sig-accent); outline-offset: 3px; }

@media (max-width: 620px) {
  .napp.napp-signature[data-motor="calculadora"] .napp-ca-alfabetos,
  .napp.napp-signature[data-motor="calculadora"] .napp-ca-caras { grid-template-columns: 1fr; }
  .napp.napp-signature[data-motor="calculadora"] .napp-ca-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .napp.napp-signature[data-motor="calculadora"] .napp-ca-desglose,
  .napp.napp-signature[data-motor="calculadora"] .napp-ca-textos,
  .napp.napp-signature[data-motor="calculadora"] .napp-ca-corresp { padding: .85rem .7rem; }
  .napp.napp-signature[data-motor="calculadora"] .napp-ca-letra { margin-right: .1rem; }
}

@media (max-width: 390px) {
  .napp.napp-signature[data-motor="calculadora"] .napp-ca-lista { grid-template-columns: 1fr; }
}

/* ── Calculadora de biorritmos: tres ondas, una lectura clara ───────
   El cálculo histórico se conserva; la interfaz distingue nivel,
   tendencia y cruce de ciclo sin convertir la gráfica en un adorno. */
.napp.napp-signature[data-motor="biorritmos"] {
  --sig-accent: #eac56f;
  --sig-accent-rgb: 234, 197, 111;
  max-width: 980px;
}
.napp.napp-signature[data-motor="biorritmos"] .napp-signature-shell {
  background:
    radial-gradient(circle at 10% 25%, rgba(242, 126, 103, .11), transparent 33%),
    radial-gradient(circle at 90% 72%, rgba(76, 190, 235, .12), transparent 35%),
    linear-gradient(150deg, rgba(7, 25, 48, .99), rgba(8, 8, 23, .99) 55%, rgba(24, 10, 38, .98));
}
.napp.napp-signature[data-motor="biorritmos"] .napp-signature-visual img {
  object-position: center 48%;
  filter: saturate(.92) contrast(1.08) brightness(.78);
}
.napp.napp-signature[data-motor="biorritmos"] .napp-signature-sigil {
  min-width: 4.65rem;
  border-radius: 999px;
  font-size: .78rem;
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi {
  width: 100%;
  padding: 0;
  border-radius: 0;
  background: none;
  color: #eef2fb;
  align-items: stretch;
  gap: 1rem;
  text-align: left;
}
.napp .napp-bi-kicker {
  margin: 0;
  color: var(--sig-accent);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .2em;
  line-height: 1.5;
  text-align: center;
  text-transform: uppercase;
}
.napp.napp-signature[data-motor="biorritmos"] .napp-intro {
  margin-bottom: .15rem;
  text-align: center;
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: 100%;
  max-width: 47rem;
  gap: .8rem .9rem;
  align-items: end;
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-form .napp-co-campo { min-width: 0; }
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-form .napp-co-campo input { width: 100%; }
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-form .napp-co-acciones,
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-form .napp-bi-privacidad,
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-form .napp-bi-err { grid-column: 1 / -1; }
.napp .napp-bi-privacidad {
  margin: -.15rem 0 0;
  color: #8f9ab3;
  font-size: .72rem;
  line-height: 1.5;
  text-align: center;
}
.napp .napp-bi-privacidad::before { content: '◇'; margin-right: .35rem; color: var(--sig-accent); }
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-err { margin: 0; text-align: center; }

.napp.napp-signature[data-motor="biorritmos"] .napp-bi-resultado {
  width: 100%;
  gap: 1rem;
  color: #eef2fb;
}
.napp .napp-bi-resultado-cab { text-align: center; }
.napp .napp-bi-fecha {
  margin: .28rem 0 .22rem;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.35rem, 4vw, 2rem);
  font-weight: 500;
  line-height: 1.25;
  text-wrap: balance;
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-cabecera {
  color: #94a5c6;
  font-size: .72rem;
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-figura {
  overflow: hidden;
  border: 1px solid rgba(var(--sig-accent-rgb), .18);
  border-radius: 1rem;
  background:
    radial-gradient(circle at 50% 50%, rgba(43, 74, 129, .16), transparent 68%),
    rgba(0, 0, 0, .25);
  box-shadow: inset 0 1px rgba(255, 255, 255, .025);
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-lienzo {
  padding: .55rem .45rem .15rem;
  border: 0;
  border-radius: 0;
  background: none;
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-svg { height: clamp(10.5rem, 29vw, 14rem); }
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-curva {
  stroke-width: 2.7;
  filter: drop-shadow(0 0 3px currentColor);
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-leyenda {
  margin: 0;
  padding: .55rem .75rem .7rem;
  border-top: 1px solid rgba(255, 255, 255, .065);
  color: #aeb9d1;
  line-height: 1.5;
  text-align: center;
}

.napp.napp-signature[data-motor="biorritmos"] .napp-bi-ciclos {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-ciclo {
  --bi-color: #f08a70;
  --bi-rgb: 240, 138, 112;
  min-width: 0;
  padding: 1rem;
  border-color: rgba(var(--bi-rgb), .24);
  border-radius: 1rem;
  background:
    linear-gradient(145deg, rgba(var(--bi-rgb), .09), transparent 48%),
    rgba(0, 0, 0, .25);
  box-shadow: inset 0 1px rgba(255, 255, 255, .025);
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-ciclo[data-ciclo="emocional"] {
  --bi-color: #e58ac0;
  --bi-rgb: 229, 138, 192;
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-ciclo[data-ciclo="intelectual"] {
  --bi-color: #74b6f0;
  --bi-rgb: 116, 182, 240;
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-ciclo header {
  align-items: flex-start;
  gap: .55rem;
  margin-bottom: .65rem;
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-punto {
  margin-top: .28rem;
  background: var(--bi-color) !important;
  box-shadow: 0 0 .75rem rgba(var(--bi-rgb), .55);
}
.napp .napp-bi-identidad { min-width: 0; }
.napp .napp-bi-identidad small {
  display: block;
  margin-top: .14rem;
  color: #7f8da9;
  font-size: .66rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.napp .napp-bi-valor {
  margin-left: auto;
  text-align: right;
  white-space: nowrap;
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-ciclo .napp-bi-pct {
  display: block;
  margin: 0;
  color: var(--bi-color);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.42rem;
  font-weight: 500;
  line-height: 1;
}
.napp .napp-bi-tendencia {
  display: block;
  margin-top: .28rem;
  color: #aeb8cd;
  font-size: .63rem;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.napp .napp-bi-escala {
  position: relative;
  height: .38rem;
  margin: 0 0 .75rem;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(var(--bi-rgb), .08), rgba(var(--bi-rgb), .36));
}
.napp .napp-bi-escala span {
  position: absolute;
  top: -.16rem;
  bottom: -.16rem;
  left: 50%;
  width: 1px;
  background: rgba(255, 255, 255, .32);
}
.napp .napp-bi-escala i {
  position: absolute;
  top: 50%;
  left: var(--bi-pos, 50%);
  width: .7rem;
  height: .7rem;
  border: 2px solid #0b0a18;
  border-radius: 50%;
  background: var(--bi-color);
  box-shadow: 0 0 0 2px rgba(var(--bi-rgb), .25), 0 0 .75rem rgba(var(--bi-rgb), .55);
  transform: translate(-50%, -50%);
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-estado {
  margin-bottom: .4rem;
  color: var(--bi-color);
  font-weight: 750;
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-ciclo[data-estado="critico"] {
  border-color: rgba(255, 190, 138, .6);
  box-shadow: 0 0 0 1px rgba(255, 190, 138, .08), 0 0 1.3rem rgba(255, 160, 100, .06);
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-texto { color: #d6ddec; line-height: 1.62; }

.napp.napp-signature[data-motor="biorritmos"] .napp-bi-extras {
  padding: .7rem .85rem;
  border: 1px solid rgba(var(--sig-accent-rgb), .16);
  border-radius: .8rem;
  background: rgba(0, 0, 0, .15);
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-extras summary {
  color: var(--sig-accent);
  font-weight: 700;
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-extras summary:focus-visible {
  outline: 2px solid var(--sig-accent);
  outline-offset: 4px;
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-avisos { gap: .75rem; }
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-avisos section {
  padding: 1rem;
  border: 1px solid rgba(var(--sig-accent-rgb), .17);
  border-radius: 1rem;
  background:
    linear-gradient(145deg, rgba(var(--sig-accent-rgb), .055), transparent 46%),
    rgba(0, 0, 0, .22);
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-avisos h3 {
  color: var(--sig-accent);
  line-height: 1.45;
}
.napp .napp-bi-avisos-nota {
  margin: -.05rem 0 .65rem;
  color: #8794af;
  font-size: .72rem;
  line-height: 1.5;
}
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-lista-criticos { gap: .35rem; }
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-lista-criticos li { color: #d6ddeb; line-height: 1.45; }
.napp.napp-signature[data-motor="biorritmos"] .napp-bi-mejor {
  display: inline-flex;
  align-items: center;
  min-height: 2.6rem;
  padding: .55rem .8rem;
  border: 1px solid rgba(var(--sig-accent-rgb), .36);
  border-radius: 999px;
  color: #fff1c4;
  background: rgba(var(--sig-accent-rgb), .08);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.1rem;
}
.napp .napp-bi-reset-wrap { margin: .05rem 0 0; text-align: center; }
.napp .napp-bi-reset {
  padding: .5rem .85rem;
  border: 0;
  border-bottom: 1px solid rgba(var(--sig-accent-rgb), .42);
  background: transparent;
  color: #b5bfd4;
  cursor: pointer;
  font: inherit;
  font-size: .8rem;
}
.napp .napp-bi-reset:hover { color: var(--sig-accent); }
.napp .napp-bi-reset:focus-visible { outline: 2px solid var(--sig-accent); outline-offset: 3px; }

@media (max-width: 760px) {
  .napp.napp-signature[data-motor="biorritmos"] .napp-bi-ciclos { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .napp.napp-signature[data-motor="biorritmos"] .napp-bi-form { grid-template-columns: 1fr; }
  .napp.napp-signature[data-motor="biorritmos"] .napp-bi-form .napp-co-campo,
  .napp.napp-signature[data-motor="biorritmos"] .napp-bi-form .napp-co-acciones,
  .napp.napp-signature[data-motor="biorritmos"] .napp-bi-form .napp-bi-privacidad,
  .napp.napp-signature[data-motor="biorritmos"] .napp-bi-form .napp-bi-err { grid-column: auto; }
  .napp.napp-signature[data-motor="biorritmos"] .napp-bi-lienzo { padding-inline: .15rem; }
  .napp.napp-signature[data-motor="biorritmos"] .napp-bi-avisos { grid-template-columns: 1fr; }
}

/* ── Numerología diaria 2026 ─────────────────────────────────────────────
   El día ocupa el centro; mes y año acompañan sin competir con él. */
.napp.napp-signature[data-motor="diaria"] {
  --sig-accent: #f0c56f;
  --sig-accent-rgb: 240, 197, 111;
  max-width: 980px;
}
.napp.napp-signature[data-motor="diaria"] .napp-signature-shell {
  background:
    radial-gradient(circle at 82% 7%, rgba(62, 160, 174, .13), transparent 28%),
    radial-gradient(circle at 8% 86%, rgba(112, 64, 151, .16), transparent 34%),
    linear-gradient(155deg, rgba(20, 17, 41, .98), rgba(5, 7, 18, .99));
}
.napp.napp-signature[data-motor="diaria"] .napp-signature-visual img {
  object-position: center 53%;
  filter: saturate(.94) contrast(1.05) brightness(.84);
}
.napp.napp-signature[data-motor="diaria"] .napp-di {
  display: block;
  padding: 0;
  border-radius: 0;
  background: none;
  color: #f5f1fb;
  text-align: left;
}
.napp .napp-di-kicker {
  margin: 0 0 .55rem;
  color: var(--sig-accent);
  font-size: .68rem;
  font-weight: 850;
  letter-spacing: .17em;
  text-align: center;
  text-transform: uppercase;
}
.napp.napp-signature[data-motor="diaria"] .napp-intro { text-align: center; }
.napp.napp-signature[data-motor="diaria"] .napp-di-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: .8rem;
  width: 100%;
  max-width: 40rem;
  text-align: left;
}
.napp.napp-signature[data-motor="diaria"] .napp-di-form .napp-co-acciones { margin: 0; }
.napp .napp-di-privacidad,
.napp.napp-signature[data-motor="diaria"] .napp-di-err {
  grid-column: 1 / -1;
  margin: 0;
  text-align: center;
}
.napp .napp-di-privacidad {
  color: #8f9ab5;
  font-size: .72rem;
  letter-spacing: .04em;
}
.napp.napp-signature[data-motor="diaria"] .napp-signature-method { margin-top: 1rem; }

.napp.napp-signature[data-motor="diaria"] .napp-di-resultado {
  width: 100%;
  color: #e9e7f1;
}
.napp .napp-di-resultado-cab {
  max-width: 42rem;
  margin: 0 auto 1.2rem;
  text-align: center;
}
.napp .napp-di-resultado-cab .napp-di-kicker { margin-bottom: .38rem; }
.napp .napp-di-hoy {
  margin: 0;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.45rem, 4vw, 2.15rem);
  font-weight: 500;
  line-height: 1.15;
  text-wrap: balance;
}
.napp .napp-di-ciclo {
  margin: .55rem 0 0;
  color: #9da8c0;
  font-size: .78rem;
  line-height: 1.5;
}

.napp .napp-di-dia {
  display: grid;
  grid-template-columns: minmax(10rem, 12.5rem) minmax(0, 1fr);
  gap: clamp(1rem, 4vw, 1.8rem);
  align-items: center;
  padding: clamp(1rem, 3.5vw, 1.55rem);
  border: 1px solid rgba(var(--sig-accent-rgb), .34);
  border-radius: 1.35rem;
  background:
    radial-gradient(circle at 8% 50%, rgba(var(--sig-accent-rgb), .13), transparent 28%),
    linear-gradient(135deg, rgba(var(--sig-accent-rgb), .055), transparent 48%),
    rgba(0, 0, 0, .25);
  box-shadow: inset 0 1px rgba(255, 255, 255, .035), 0 .9rem 2.4rem rgba(0, 0, 0, .16);
}
.napp .napp-di-orbita {
  position: relative;
  display: grid;
  place-items: center;
  width: min(100%, 11rem);
  aspect-ratio: 1;
  margin: 0 auto;
  border: 1px solid rgba(var(--sig-accent-rgb), .44);
  border-radius: 50%;
  background:
    radial-gradient(circle, rgba(var(--sig-accent-rgb), .22) 0 5%, transparent 6% 34%, rgba(var(--sig-accent-rgb), .055) 35% 36%, transparent 37%),
    rgba(6, 8, 20, .7);
  box-shadow: 0 0 0 .65rem rgba(var(--sig-accent-rgb), .035), 0 0 2.8rem rgba(var(--sig-accent-rgb), .14), inset 0 0 2rem rgba(var(--sig-accent-rgb), .06);
}
.napp .napp-di-orbita::before,
.napp .napp-di-orbita::after {
  content: '';
  position: absolute;
  border: 1px solid rgba(var(--sig-accent-rgb), .2);
  border-radius: 50%;
}
.napp .napp-di-orbita::before { inset: 17%; }
.napp .napp-di-orbita::after {
  inset: 34%;
  border-color: rgba(var(--sig-accent-rgb), .56);
  box-shadow: 0 0 1.25rem rgba(var(--sig-accent-rgb), .18);
}
.napp .napp-di-numero {
  position: relative;
  z-index: 1;
  color: #ffe8ae;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(3.5rem, 10vw, 5.6rem);
  line-height: 1;
  text-shadow: 0 0 1.6rem rgba(var(--sig-accent-rgb), .3);
}
.napp .napp-di-rotulo {
  margin: 0 0 .3rem;
  color: var(--sig-accent);
  font-size: .65rem;
  font-weight: 850;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.napp .napp-di-dia .napp-di-titulo {
  margin: 0 0 .65rem;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.45rem, 3.8vw, 2rem);
  font-weight: 500;
  line-height: 1.12;
  text-wrap: balance;
}
.napp .napp-di-texto {
  margin: 0;
  color: #d9dce7;
  font-size: .91rem;
  line-height: 1.7;
  text-wrap: pretty;
}
.napp .napp-di-claves {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .55rem;
  margin-top: 1rem;
}
.napp .napp-di-claves article {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: .5rem;
  min-width: 0;
  padding: .7rem;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: .8rem;
  background: rgba(255, 255, 255, .025);
}
.napp .napp-di-claves article > span { color: var(--sig-accent); font-size: .9rem; line-height: 1.25; }
.napp .napp-di-claves b {
  display: block;
  margin-bottom: .22rem;
  color: #fff1ca;
  font-size: .62rem;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.napp .napp-di-claves p { margin: 0; color: #b9c1d1; font-size: .72rem; line-height: 1.45; }

.napp .napp-di-contexto { margin-top: 1rem; }
.napp .napp-di-contexto > h3 {
  margin: 0 0 .65rem;
  color: #aab4ca;
  font-size: .7rem;
  letter-spacing: .13em;
  text-align: center;
  text-transform: uppercase;
}
.napp .napp-di-contexto-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.napp .napp-di-contexto-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-content: start;
  gap: .7rem .85rem;
  min-width: 0;
  padding: 1rem;
  border: 1px solid rgba(var(--sig-accent-rgb), .18);
  border-radius: 1rem;
  background: linear-gradient(145deg, rgba(var(--sig-accent-rgb), .055), transparent 50%), rgba(0, 0, 0, .18);
}
.napp .napp-di-mini-numero {
  grid-row: 1;
  display: grid;
  place-items: center;
  width: 3.3rem;
  height: 3.3rem;
  border: 1px solid rgba(var(--sig-accent-rgb), .58);
  border-radius: 50%;
  color: var(--sig-accent);
  background: rgba(5, 7, 17, .62);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.65rem;
}
.napp .napp-di-contexto-card > div { align-self: center; min-width: 0; }
.napp .napp-di-contexto-card .napp-di-rotulo { margin-bottom: .2rem; }
.napp .napp-di-contexto-card .napp-di-titulo {
  margin: 0;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.12rem;
  font-weight: 500;
  line-height: 1.2;
}
.napp .napp-di-contexto-card > .napp-di-texto,
.napp .napp-di-contexto-card > .napp-di-como { grid-column: 1 / -1; }
.napp .napp-di-contexto-card > .napp-di-como {
  margin: -.15rem 0 0;
  padding-top: .6rem;
  border-top: 1px solid rgba(255, 255, 255, .065);
  color: #8f9ab2;
  font-size: .7rem;
  line-height: 1.45;
}

.napp .napp-di-calculo {
  max-width: 39rem;
  margin: 1rem auto 0;
  padding: .8rem .95rem;
  border: 1px solid rgba(var(--sig-accent-rgb), .14);
  border-radius: .85rem;
  background: rgba(0, 0, 0, .14);
  color: #aeb7ca;
}
.napp .napp-di-calculo summary { cursor: pointer; color: var(--sig-accent); font-size: .76rem; font-weight: 750; text-align: center; }
.napp .napp-di-calculo summary:focus-visible { outline: 2px solid var(--sig-accent); outline-offset: 3px; }
.napp .napp-di-calculo div { margin-top: .65rem; }
.napp .napp-di-calculo p { margin: .3rem 0; font-size: .76rem; line-height: 1.55; }
.napp .napp-di-reiniciar-wrap { margin: .9rem 0 0; text-align: center; }
.napp .napp-di-reiniciar {
  padding: .5rem .8rem;
  border: 0;
  border-bottom: 1px solid rgba(var(--sig-accent-rgb), .46);
  background: transparent;
  color: #b5bfd2;
  cursor: pointer;
  font: inherit;
  font-size: .79rem;
}
.napp .napp-di-reiniciar:hover { color: var(--sig-accent); }
.napp .napp-di-reiniciar:focus-visible { outline: 2px solid var(--sig-accent); outline-offset: 3px; }

@media (max-width: 760px) {
  .napp .napp-di-dia { grid-template-columns: 1fr; text-align: center; }
  .napp .napp-di-claves { text-align: left; }
}
@media (max-width: 620px) {
  .napp.napp-signature[data-motor="diaria"] .napp-di-form { grid-template-columns: 1fr; }
  .napp.napp-signature[data-motor="diaria"] .napp-di-form .napp-co-acciones,
  .napp .napp-di-privacidad,
  .napp.napp-signature[data-motor="diaria"] .napp-di-err { grid-column: auto; }
  .napp .napp-di-orbita { width: 8.8rem; }
  .napp .napp-di-claves,
  .napp .napp-di-contexto-grid { grid-template-columns: 1fr; }
  .napp .napp-di-contexto-card { padding: .9rem; }
}
