/* Agregar familiar V2 — capa visual aprobada (propuesta «Agregar familiar V2», 22-oct-2026).
   - El fondo se difumina y oscurece: la caja no parece pegada al árbol.
   - Caja centrada también en móvil, con superficie propia.
   - Seis casillas iguales con ícono.
   - Guardado: check que se dibuja; sin «Después» (tocar fuera vuelve al árbol).
   - Invitar: solo el enlace, Copiar y Compartir.
   Solo estilos: los selectores empiezan por las clases hafv2-* que agrega index.html. */

html body .humanidad-modal-backdrop.hafv2-backdrop{
  position:fixed!important;inset:0!important;z-index:10040!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  padding:16px!important;box-sizing:border-box!important;
  background:rgba(2,7,16,.62)!important;
  -webkit-backdrop-filter:blur(10px) saturate(.85)!important;backdrop-filter:blur(10px) saturate(.85)!important;
}
html body .humanidad-modal-backdrop.hafv2-backdrop .person-drawer.hafv2-card{
  position:relative!important;inset:auto!important;transform:none!important;
  width:100%!important;max-width:400px!important;
  max-height:min(calc(var(--humanity-vh,100dvh) - 32px),680px)!important;
  border-radius:26px!important;background:#102a4c!important;
  border:1px solid rgba(217,179,106,.34)!important;
  box-shadow:0 30px 80px rgba(0,0,0,.6),0 0 0 6px rgba(7,19,39,.35)!important;
  animation:hafv2-in .22s ease-out both!important;
}
html body .hafv2-card.person-drawer::before{display:none!important}
html body .hafv2-card .new-branch-modal-header{background:transparent!important;padding:20px 20px 6px!important}
html body .hafv2-card .new-branch-header-copy .account-kicker{color:#a9c2df!important;font-weight:600!important}
html body .hafv2-card .new-branch-modal-footer{background:transparent!important;border-top:0!important;padding:8px 20px 20px!important}

/* Seis casillas iguales */
html body .hafv2-card .humanidad-quick-relation-chips{
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important;
}
html body .hafv2-card .humanidad-quick-relation-chip{
  display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:7px!important;
  min-height:82px!important;padding:10px 4px!important;border-radius:16px!important;
  background:#0b1f3b!important;color:#f5f8ff!important;border:1px solid rgba(204,222,245,.2)!important;
  font:600 14.5px/1.15 Inter,system-ui,sans-serif!important;box-shadow:none!important;
  transition:background .15s,border-color .15s,transform .12s!important;
}
html body .hafv2-card .humanidad-quick-relation-chip:active{transform:scale(.97)!important}
html body .hafv2-card .humanidad-quick-relation-chip.is-active{background:#d9b36a!important;color:#1a1408!important;border-color:#d9b36a!important}
html body .hafv2-card .humanidad-quick-relation-chip::before,html body .hafv2-card .humanidad-quick-relation-chip::after{display:none!important}
html body .hafv2-card .hafv2-chip-icon{flex:none;width:24px;height:24px}
html body .hafv2-card .humanidad-quick-name{background:#0b1f3b!important;border-radius:14px!important;min-height:52px!important}
/* «Fecha y lugar»: una línea de 44 px, sin caja; se despliega solo si se toca */
html body .humanidad-modal-backdrop .hafv2-card details.humanidad-compact-optional{border:0!important;background:transparent!important;padding:0!important;margin:0!important;min-height:0!important;height:auto!important;box-shadow:none!important;border-radius:0!important}
html body .humanidad-modal-backdrop .hafv2-card details.humanidad-compact-optional[open]{border:1px solid rgba(204,222,245,.18)!important;border-radius:14px!important;padding-bottom:6px!important}
/* Contexto: el título ya dice «Nuevo familiar de …»; la caja repetía lo mismo y ocupaba
   espacio. El selector del otro progenitor (.new-branch-coparent) sigue visible cuando aplica. */
html body .hafv2-card .humanidad-quick-context{display:none!important}
html body .humanidad-modal-backdrop .hafv2-card details.humanidad-compact-optional summary{color:#f0d7a1!important;font:600 14px/1.3 Inter,system-ui,sans-serif!important;min-height:44px!important;padding:0 4px!important;display:flex!important;align-items:center!important;background:transparent!important;border:0!important}

/* Guardado */
html body .hafv2-card[data-easy-stage="saved"] .humanidad-compact-state-head{
  display:flex!important;flex-direction:column!important;align-items:center!important;text-align:center!important;gap:8px!important;padding-top:4px!important;
}
html body .hafv2-card[data-easy-stage="saved"] .humanidad-compact-name{font:600 23px/1.2 'Playfair Display',Georgia,serif!important}
html body .hafv2-card[data-easy-stage="saved"] .humanidad-compact-copy{text-align:center!important;color:#ccdef5!important;margin:4px 0 0!important}
html body .hafv2-card .hafv2-check{
  position:relative!important;width:72px!important;height:72px!important;border-radius:50%!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  background:#d9b36a!important;border:0!important;color:#1a1408!important;
  box-shadow:0 10px 30px rgba(217,179,106,.35)!important;
  animation:hafv2-pop .42s cubic-bezier(.2,.9,.3,1.2) both!important;
}
html body .hafv2-card .hafv2-check svg path{stroke-dasharray:48;stroke-dashoffset:48;animation:hafv2-draw .38s .22s ease-out forwards}
html body .hafv2-card .hafv2-check-ring{position:absolute;inset:0;border-radius:50%;border:2px solid #d9b36a;animation:hafv2-ring .9s .15s ease-out both;pointer-events:none}
html body .hafv2-card .hafv2-outside-hint{margin:10px 0 0!important;text-align:center!important;font-size:12.5px!important;color:#8aa4c4!important}

/* Invitar: solo el enlace */
html body .hafv2-card .hafv2-link-row{
  display:flex!important;align-items:center!important;gap:8px!important;min-height:52px!important;
  padding:0 6px 0 14px!important;border-radius:14px!important;background:#0b1f3b!important;border:1px solid rgba(204,222,245,.22)!important;
}
html body .hafv2-card .hafv2-link-row .humanidad-compact-link{
  flex:1 1 auto!important;min-width:0!important;padding:0!important;border:0!important;background:transparent!important;
  font:500 13px/1.35 Inter,system-ui,sans-serif!important;color:#f5f8ff!important;letter-spacing:0!important;
  white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important;padding:8px 0!important;
}
html body .hafv2-card .hafv2-copy{
  flex:none!important;min-height:40px!important;padding:0 14px!important;border-radius:10px!important;
  border:1px solid rgba(217,179,106,.45)!important;background:transparent!important;color:#f0d7a1!important;
  font:600 13.5px Inter,system-ui,sans-serif!important;cursor:pointer!important;
}
html body .hafv2-card .humanidad-compact-actions>button:only-child{grid-column:1/-1}

/* «¿Salir sin guardar?»: caja chica (gana a humanidad-blue-surfaces-v1.css) */
html body[class] [data-humanidad-unsaved-dialog],html body [data-humanidad-unsaved-dialog]{
  position:fixed!important;inset:0!important;z-index:100090!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  background:rgba(2,7,16,.5)!important;padding:0 36px!important;
}
html body[class] [data-humanidad-unsaved-dialog]>.person-drawer.hafv2-discard{
  position:relative!important;inset:auto!important;left:auto!important;top:auto!important;transform:none!important;
  width:min(320px,100%)!important;max-height:none!important;padding:20px!important;border-radius:22px!important;
  background:#13325a!important;border:1px solid rgba(204,222,245,.18)!important;box-shadow:0 24px 60px rgba(0,0,0,.6)!important;text-align:center!important;
}
html body[class] [data-humanidad-unsaved-dialog]>.hafv2-discard h3{font:600 17px/1.3 Inter,system-ui,sans-serif!important;margin:0 0 14px!important;color:#f5f8ff!important}
html body[class] [data-humanidad-unsaved-dialog]>.hafv2-discard>div{display:flex!important;flex-direction:column!important;gap:10px!important}
html body[class] [data-humanidad-unsaved-dialog]>.hafv2-discard>div>button{min-height:48px!important;border-radius:14px!important;width:100%!important;padding:0 14px!important;font:600 15px Inter,system-ui,sans-serif!important;box-shadow:none!important}
html body[class] [data-humanidad-unsaved-dialog]>.hafv2-discard>div>button:first-child{background:#d9b36a!important;color:#1a1408!important;border:0!important}
html body[class] [data-humanidad-unsaved-dialog]>.hafv2-discard>div>button:last-child{background:transparent!important;color:#f5f8ff!important;border:1px solid rgba(204,222,245,.22)!important}

@keyframes hafv2-in{from{transform:translateY(10px) scale(.98);opacity:0}to{transform:none;opacity:1}}
@keyframes hafv2-pop{0%{transform:scale(.6);opacity:0}60%{transform:scale(1.08);opacity:1}100%{transform:scale(1)}}
@keyframes hafv2-draw{from{stroke-dashoffset:48}to{stroke-dashoffset:0}}
@keyframes hafv2-ring{0%{transform:scale(.8);opacity:.55}100%{transform:scale(1.6);opacity:0}}
@media (prefers-reduced-motion:reduce){
  html body .hafv2-card,html body .hafv2-card .hafv2-check,html body .hafv2-card .hafv2-check-ring{animation:none!important}
  html body .hafv2-card .hafv2-check svg path{animation:none!important;stroke-dashoffset:0!important}
}

/* H-ID del familiar guardado: centrado, como algo propio de esa persona */
html body .hafv2-card[data-easy-stage] .humanidad-compact-hid{
  flex-basis:auto!important;padding:8px 18px 9px!important;margin:6px 0 0!important;align-self:center!important;
  display:inline-flex!important;flex-direction:column!important;align-items:center!important;gap:2px!important;
  border-radius:999px!important;border:1px solid rgba(217,179,106,.55)!important;
  background:linear-gradient(180deg,rgba(217,179,106,.16),rgba(217,179,106,.04))!important;
  box-shadow:0 0 0 4px rgba(217,179,106,.06),0 8px 24px rgba(217,179,106,.12)!important;
  color:#f0d7a1!important;font:700 17px/1.1 Inter,system-ui,sans-serif!important;letter-spacing:.14em!important;
  animation:hafv2-hid .5s .5s ease-out both!important;
}
html body .hafv2-card[data-easy-stage] .humanidad-compact-hid::before{
  content:'ID Humanidad';font:600 9.5px/1 Inter,system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#a9c2df;
}
@keyframes hafv2-hid{from{opacity:0;transform:translateY(6px) scale(.96)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){html body .hafv2-card[data-easy-stage] .humanidad-compact-hid{animation:none!important}}

/* Árbol: si una persona tiene familia que no entra en esta vista (p. ej. los padres de
   tu pareja), su tarjeta ofrece «Ver su familia», que la centra sin salir del árbol. */
html body #familyView .humanidad-f3-card .humanidad-tree-more-family{
  position:absolute;left:50%;top:-14px;transform:translateX(-50%);z-index:3;
  min-height:28px;padding:0 12px;border-radius:999px;white-space:nowrap;cursor:pointer;
  border:1px solid rgba(217,179,106,.6);background:#0b1d36;color:#f0d7a1;
  font:600 11.5px/1 Inter,system-ui,sans-serif;box-shadow:0 6px 16px rgba(0,0,0,.35);
}
html body #familyView .humanidad-f3-card .humanidad-tree-more-family::before{content:'↑ ';}
html body #familyView .humanidad-f3-card .humanidad-tree-more-family:focus-visible{outline:2px solid #f0d7a1;outline-offset:2px}