/*
 * GARCÍA CANDO · NODE R5.01
 * Corrección puntual sobre la última base funcional:
 * - Compartir adopta exactamente la jerarquía visual de Inicio.
 * - Biografía + enlaces se agrupan en una sola tarjeta de vidrio esmerilado.
 * - Zona segura superior se resuelve por separación física del contenido, sin una placa negra detrás del menú.
 * - En vertical, Node y sus líneas decorativas bajan para respirar mejor debajo de la barra.
 * No modifica API, datos, editor, cortinillas, enlaces ni lógica de compartir.
 */

/* 1) COMPARTIR = INICIO: neutraliza el tratamiento de CTA/píldora que pueda llegar de hojas globales. */
html body .node-top .node-actions > .back,
html body .node-top .node-actions > .share,
html body .node-top .node-actions > button.share[data-gca-share="node"]{
  appearance:none!important;
  -webkit-appearance:none!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:0!important;
  min-height:0!important;
  width:auto!important;
  height:auto!important;
  margin:0!important;
  padding:10px 12px!important;
  border:0!important;
  border-left:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#e9ecec!important;
  box-shadow:none!important;
  font:inherit!important;
  font-size:9px!important;
  font-weight:400!important;
  line-height:1!important;
  letter-spacing:.14em!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  cursor:pointer!important;
  transform:none!important;
}
html body .node-top .node-actions > .back:hover,
html body .node-top .node-actions > .share:hover,
html body .node-top .node-actions > button.share[data-gca-share="node"]:hover{
  color:#fff!important;
  background:rgba(255,255,255,.04)!important;
  border:0!important;
  box-shadow:none!important;
  transform:none!important;
}

/* 2) TARJETA ÚNICA DE VIDRIO ESMERILADO: lema + accesos. */
html body .node-glass-panel{
  position:relative!important;
  isolation:isolate!important;
  width:100%!important;
  max-width:660px!important;
  margin:0!important;
  padding:clamp(18px,2.2vw,28px)!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.15)!important;
  border-radius:28px!important;
  background:
    linear-gradient(145deg,rgba(21,25,26,.62),rgba(9,11,12,.38))!important;
  -webkit-backdrop-filter:blur(24px) saturate(122%)!important;
  backdrop-filter:blur(24px) saturate(122%)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 22px 58px rgba(0,0,0,.20)!important;
}
html body .node-glass-panel::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 12% 0%,rgba(255,255,255,.08),transparent 36%),
    linear-gradient(180deg,rgba(255,255,255,.025),transparent 44%);
}
html body .node-glass-panel .bio{
  max-width:52ch!important;
  margin:0!important;
  padding:0 0 22px!important;
  color:#d4d9da!important;
  font-size:16px!important;
  font-weight:300!important;
  line-height:1.65!important;
}
html body .node-glass-panel .bio::before{
  display:none!important;
  content:none!important;
}
html body .node-glass-panel .links{
  display:grid!important;
  margin:0!important;
  padding:0!important;
  border-top:1px solid rgba(255,255,255,.13)!important;
  background:transparent!important;
}
html body .node-glass-panel .node-link{
  min-height:90px!important;
  padding:0 2px!important;
  border-bottom:1px solid rgba(255,255,255,.13)!important;
  background:transparent!important;
}
html body .node-glass-panel .node-link:last-child{
  border-bottom:0!important;
}
html body .node-glass-panel .node-link::before{
  color:rgba(219,226,227,.47)!important;
}
html body .node-glass-panel .node-link strong{
  color:#f0f3f3!important;
}
html body .node-glass-panel .node-link small{
  color:rgba(213,220,221,.52)!important;
}
html body .node-glass-panel .node-link b{
  color:#f3f5f5!important;
}

/* 3) ZONA SEGURA DEL MENÚ, SIN PLACA NEGRA EXTRA.
   R4.74 añadía un ::before opaco detrás de .node-top. Se neutraliza en Node.
   La separación se obtiene moviendo el contenido, no dibujando otra caja negra. */
html body .node-top{
  isolation:isolate!important;
  z-index:1000!important;
  background:rgba(10,13,13,.82)!important;
  -webkit-backdrop-filter:blur(24px) saturate(120%)!important;
  backdrop-filter:blur(24px) saturate(120%)!important;
  box-shadow:0 16px 46px rgba(0,0,0,.18)!important;
}
html body .node-top::before{
  content:none!important;
  display:none!important;
  background:none!important;
  box-shadow:none!important;
}
html body .profile{
  padding-top:128px!important;
}

@media(max-width:900px){
  html body .node-content{
    --node-mobile-menu-height:66px;
    --node-mobile-safe-gap:78px;
  }
  html body .node-top{
    top:max(8px,env(safe-area-inset-top))!important;
    box-shadow:0 14px 38px rgba(0,0,0,.16)!important;
  }
  html body .profile{
    /* En vertical: Node, kicker y handle bajan como un solo bloque. */
    padding-top:calc(var(--node-mobile-menu-height) + var(--node-mobile-safe-gap) + 28px)!important;
  }
  html body .node-content::before{
    /* La escuadra decorativa baja junto con Node; no invade la zona de menú. */
    top:176px!important;
  }
  html body .node-glass-panel{
    border-radius:24px!important;
    padding:20px 18px!important;
  }
  html body .node-glass-panel .bio{
    padding-bottom:18px!important;
    font-size:15px!important;
    line-height:1.62!important;
  }
  html body .node-glass-panel .node-link{
    grid-template-columns:34px minmax(0,1fr) auto!important;
    gap:14px!important;
    min-height:86px!important;
  }
}

@media(max-width:520px){
  html body .profile{
    padding-top:170px!important;
  }
  html body .node-content::before{
    top:174px!important;
  }
  html body .node-top{
    padding-left:16px!important;
    padding-right:14px!important;
  }
  html body .node-actions{
    gap:2px!important;
  }
  html body .node-top .node-actions > .back,
  html body .node-top .node-actions > .share,
  html body .node-top .node-actions > button.share[data-gca-share="node"]{
    padding:10px 9px!important;
    font-size:8px!important;
    letter-spacing:.12em!important;
  }
  html body .node-glass-panel{
    border-radius:22px!important;
  }
}
