/* INSIGHT — capa de overrides acumulados (deuda tecnica).
   Son ajustes sucesivos sobre base.css: nodos derechos, X del hero-card, modo light, experiencia.
   El orden importa (cascada). Consolidar con cuidado, verificando visualmente en desktop y movil. */
  #motionBtn{display:none!important;}

  /* CEREBRO LIGHT: rojo/naranja visible sobre fondo blanco */
  body.light-mode #scene{
    opacity:1!important;
    filter:hue-rotate(95deg) saturate(2.35) brightness(.82) contrast(1.42)!important;
    mix-blend-mode:normal!important;
  }
  body.light-mode .synapse,
  body.light-mode .radar-dot-unused{
    filter:hue-rotate(95deg) saturate(2.1) brightness(.9) contrast(1.25)!important;
  }
  body.light-mode .hero-card{
    background:rgba(255,255,255,.86)!important;
  }


  /* OVERRIDE FINAL: LIGHT SIN VERDES, SOLO ROJO/NARANJA */
  body.light-mode #scene,
  body.light-mode .synapse,
  body.light-mode .radar-dot-unused{
    filter:none!important;
    -webkit-filter:none!important;
  }
  body.light-mode #scene{
    opacity:1!important;
    mix-blend-mode:normal!important;
  }
  body.light-mode .hero-card,
  body.light-mode .ux-toolbar,
  body.light-mode .bottomnav,
  body.light-mode .radar{
    backdrop-filter:none!important;
  }


#radar,.radar,.radar-dot{display:none!important}

  /* AJUSTE FINAL: etiquetas de proyectos blancas y nodos externos a la derecha */
  .synapse{
    width:340px;
    height:82px;
  }
  .synapse .lbl{
    color:#ffffff!important;
    text-shadow:0 0 12px rgba(0,0,0,.95), 0 0 18px color-mix(in srgb,var(--c) 18%,transparent);
    font-size:12px;
  }
  .synapse .num{
    color:#ffffff!important;
    opacity:.92;
  }
  .synapse.right .dot{
    position:absolute;
    right:0;
    top:5px;
  }
  .synapse.right .lbl{
    left:auto;
    right:92px;
    width:210px;
    text-align:right;
  }
  .synapse.right .num{
    left:auto;
    right:92px;
    top:3px;
    text-align:right;
    width:210px;
  }
  .synapse.right .wire{
    right:58px;
    width:var(--wire,260px)!important;
  }
  .synapse.right .wire::before{
    background:linear-gradient(270deg,var(--c),transparent);
  }
  .synapse.right .wire::after{
    animation-direction:reverse;
  }
  body.light-mode .synapse .lbl,
  body.light-mode .synapse .num{
    color:#1f130d!important;
    text-shadow:none!important;
  }


  /* NODOS EXTERNOS: zona derecha */
  #synapses{position:fixed;inset:0;z-index:16;pointer-events:none}
  #synapses .synapse{pointer-events:auto}
  .synapse.right{
    width:330px;
  }
  .synapse.right .dot{
    right:4px;
  }
  .synapse.right .wire{
    right:62px;
  }
  .synapse.right .lbl{
    width:195px;
    right:96px;
  }
  .synapse.right .num{
    width:195px;
    right:96px;
  }


  /* NODOS EXTERNOS DEFINITIVOS — zona vacía derecha */
  #synapses{position:fixed;inset:0;z-index:16;pointer-events:none}
  #synapses .synapse{pointer-events:auto}

  .synapse{
    width:420px;
    height:88px;
  }
  .synapse.right{
    right:auto;
  }
  .synapse.right .dot{
    position:absolute;
    right:0;
    top:8px;
    width:74px;
    height:74px;
  }
  .synapse .dot svg.ic{
    width:30px;
    height:30px;
    z-index:5;
  }
  .synapse .core{
    width:22px;
    height:22px;
  }
  .synapse .ring{
    inset:7px;
    border-width:1.3px;
  }
  .synapse .ring2{inset:-2px}
  .synapse .ring3{inset:-11px}
  .synapse.right .wire{
    right:64px;
    width:var(--wire,330px)!important;
    height:1px;
    opacity:.78;
  }
  .synapse.right .wire::before{
    background:linear-gradient(270deg,var(--c),transparent);
  }
  .synapse.right .wire::after{
    animation-direction:reverse;
  }
  .synapse.right .lbl{
    left:auto;
    right:104px;
    top:50%;
    transform:translateY(-30%);
    width:190px;
    text-align:right;
    color:#ffffff!important;
    font-family:var(--fmono);
    font-size:18px;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
    text-shadow:0 0 16px rgba(0,0,0,.92),0 0 24px color-mix(in srgb,var(--c) 25%,transparent);
  }
  .synapse.right .num{
    left:auto;
    right:104px;
    top:8px;
    width:190px;
    text-align:right;
    color:var(--c)!important;
    font-family:var(--fmono);
    font-size:10px;
    letter-spacing:.16em;
    opacity:1;
  }
  .synapse:hover{
    transform:translateX(-4px) scale(1.05);
  }
  .synapse.active .ring,
  .synapse:hover .ring{
    box-shadow:0 0 42px color-mix(in srgb,var(--c) 85%,transparent), inset 0 0 26px color-mix(in srgb,var(--c) 28%,transparent);
  }
  @media(max-width:1100px){
    .synapse{width:340px}
    .synapse.right .wire{width:220px!important}
    .synapse.right .lbl{width:150px; right:94px; font-size:15px}
    .synapse.right .num{width:150px; right:94px}
  }


  /* MARCA PERSONAL — énfasis en nombre real */
  .brand{
    min-width:390px;
  }
  .brand small{
    font-size:10px!important;
    letter-spacing:.18em!important;
    color:rgba(236,232,255,.78)!important;
  }
  .brand small b{
    color:#ffffff!important;
    font-weight:800!important;
    letter-spacing:.2em!important;
    text-shadow:0 0 16px rgba(192,132,252,.48);
  }
  body.light-mode .brand small{
    color:#6e4a3c!important;
  }
  body.light-mode .brand small b{
    color:#1f130d!important;
    text-shadow:none!important;
  }
  @media(max-width:920px){
    .brand{min-width:0}
    .brand small{
      font-size:8px!important;
      letter-spacing:.1em!important;
      max-width:260px;
      white-space:normal!important;
      line-height:1.35;
    }
  }


  /* INTRO — explicación clara del sistema y logo personal */
  #intro{
    gap:0;
  }
  #intro .intro-logo{
    width:min(220px,34vw);
    max-height:120px;
    object-fit:contain;
    margin-bottom:18px;
    filter:drop-shadow(0 0 20px rgba(168,85,247,.28));
    border-radius:16px;
  }
  #intro .eyebrow{
    margin-bottom:16px!important;
  }
  #intro .big{
    font-size:clamp(48px,10vw,116px)!important;
    margin-top:0;
  }
  #intro .l1{
    margin-top:22px!important;
  }
  #intro .l2{
    max-width:82ch!important;
    font-size:clamp(14px,1.55vw,17px)!important;
    line-height:1.75!important;
    margin-top:18px!important;
  }
  .intro-guide{
    display:flex;
    justify-content:center;
    gap:10px;
    flex-wrap:wrap;
    margin-top:22px;
  }
  .intro-guide span{
    font-family:var(--fmono);
    font-size:10px;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:var(--cyan);
    border:1px solid rgba(34,211,238,.34);
    background:rgba(34,211,238,.06);
    padding:8px 12px;
    clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));
  }
  #intro .enter{
    margin-top:30px!important;
  }
  #intro .who{
    max-width:90vw;
    line-height:1.5;
  }
  body.light-mode #intro .intro-logo{
    background:rgba(255,255,255,.72);
    box-shadow:0 12px 36px rgba(255,107,53,.16);
    filter:none;
  }
  body.light-mode .intro-guide span{
    color:#d9480f!important;
    border-color:rgba(217,72,15,.28)!important;
    background:rgba(255,107,53,.08)!important;
  }
  @media(max-width:720px){
    #intro .intro-logo{width:190px;margin-bottom:12px}
    .intro-guide{display:none}
    #intro .l2{font-size:13.5px!important;line-height:1.62!important}
  }


  /* LIGHT MODE SAFE OVERRIDE — mejora visual sin tocar la lógica 3D */
  body.light-mode{
    --bg:#f6efe9!important;
    --v1:#ff4d3d!important;
    --v2:#e02424!important;
    --mag:#ff6b57!important;
    --cyan:#ff7a45!important;
    --gold:#ff9f1c!important;
    --ink:#24130e!important;
    --dim:#65453a!important;
    --faint:#8a6255!important;
    --hud:rgba(224,36,36,.30)!important;
    --hud-bg:rgba(255,250,246,.92)!important;
    --glass:rgba(255,252,249,.96)!important;
    background:radial-gradient(120% 92% at 50% 42%, #fffaf7 0%, #f6eee9 42%, #edd9cf 100%)!important;
    color:var(--ink)!important;
  }

  body.light-mode #scene{
    opacity:.94!important;
    filter:none!important;
    mix-blend-mode:normal!important;
  }

  body.light-mode #scene canvas{
    opacity:1!important;
    filter:contrast(1.12) saturate(1.08)!important;
  }

  body.light-mode .scan{opacity:.03!important}
  body.light-mode .vig{
    background:radial-gradient(120% 90% at 50% 46%, transparent 48%, rgba(224,36,36,.06) 82%, rgba(255,255,255,.56) 100%)!important;
  }

  body.light-mode .hero-card,
  body.light-mode .bottomnav,
  body.light-mode .ux-search input,
  body.light-mode .ux-results,
  body.light-mode .simple-grid,
  body.light-mode #tip,
  body.light-mode .ux-toolbar{
    background:rgba(255,251,248,.92)!important;
    border-color:rgba(224,36,36,.22)!important;
    box-shadow:0 16px 48px rgba(224,36,36,.08)!important;
    color:var(--ink)!important;
  }

  body.light-mode .panel{
    background:linear-gradient(180deg,rgba(255,253,250,.98),rgba(252,242,236,.99))!important;
    border-left-color:rgba(224,36,36,.28)!important;
    box-shadow:-34px 0 70px rgba(224,36,36,.10)!important;
    color:var(--ink)!important;
  }

  body.light-mode .vblock,
  body.light-mode .svcard,
  body.light-mode .tcard,
  body.light-mode .p-cell,
  body.light-mode .trust-card,
  body.light-mode .pkg,
  body.light-mode .step,
  body.light-mode .sol,
  body.light-mode .simple-card,
  body.light-mode .mini-metrics div,
  body.light-mode .award,
  body.light-mode .cta-band,
  body.light-mode .ct-cta,
  body.light-mode .field input,
  body.light-mode .field select,
  body.light-mode .field textarea,
  body.light-mode .chan,
  body.light-mode .stats .s,
  body.light-mode .profile .av,
  body.light-mode .panel-enhance{
    background:rgba(255,255,255,.92)!important;
    border-color:rgba(224,36,36,.18)!important;
    color:var(--ink)!important;
    box-shadow:0 12px 32px rgba(224,36,36,.07)!important;
  }

  body.light-mode .hero-card p,
  body.light-mode .p-lead,
  body.light-mode .p-body,
  body.light-mode .bio p,
  body.light-mode .svcard p,
  body.light-mode .pkg p,
  body.light-mode .pkg li,
  body.light-mode .step p,
  body.light-mode .sol p,
  body.light-mode .cta-band p,
  body.light-mode .simple-card p,
  body.light-mode .ux-result p,
  body.light-mode .sk-intro,
  body.light-mode .chan .v,
  body.light-mode .ct-cta p{
    color:#68473d!important;
  }

  body.light-mode .p-title,
  body.light-mode .hero-card h2,
  body.light-mode .profile h3,
  body.light-mode .svcard h4,
  body.light-mode .pkg h4,
  body.light-mode .step h4,
  body.light-mode .simple-card h3,
  body.light-mode .ux-result b,
  body.light-mode .ct-cta h3,
  body.light-mode .vblock h4,
  body.light-mode .tcard .nm,
  body.light-mode .chan .k{
    color:#28140e!important;
    text-shadow:none!important;
  }

  body.light-mode .p-cell .v,
  body.light-mode .stats .s .n,
  body.light-mode .mini-metrics b,
  body.light-mode .trust-card b,
  body.light-mode .brand h1,
  body.light-mode .hero-k,
  body.light-mode .p-eyebrow,
  body.light-mode .blk-h,
  body.light-mode .pkg .pk,
  body.light-mode .sol .k,
  body.light-mode .ux-result .kind,
  body.light-mode .simple-card .k{
    color:#d91f26!important;
    text-shadow:none!important;
  }

  body.light-mode .topnav a,
  body.light-mode .bottomnav a,
  body.light-mode .brand small,
  body.light-mode .mini-metrics span,
  body.light-mode .trust-card span,
  body.light-mode .p-cell .k,
  body.light-mode .tcard .lv,
  body.light-mode .profile .rl,
  body.light-mode .profile .loc{
    color:#8b5d4d!important;
  }

  body.light-mode .chip,
  body.light-mode .ux-chipbtn,
  body.light-mode .hero-btn,
  body.light-mode .bottomnav a,
  body.light-mode .send{
    background:#fffaf6!important;
    color:#4a281f!important;
    border-color:rgba(224,36,36,.26)!important;
  }

  body.light-mode .chip.on,
  body.light-mode .ux-chipbtn.on,
  body.light-mode .hero-btn.primary,
  body.light-mode .send,
  body.light-mode .btn-p{
    background:linear-gradient(135deg,#ff5a45,#ff7a45)!important;
    color:#fff!important;
    border-color:#e02424!important;
    box-shadow:0 10px 24px rgba(224,36,36,.20)!important;
  }

  body.light-mode .synapse .lbl{
    color:#2a140e!important;
    text-shadow:0 1px 0 rgba(255,255,255,.42)!important;
  }

  body.light-mode .synapse .num{
    color:#d91f26!important;
    text-shadow:none!important;
  }

  body.light-mode .synapse .ring{
    border-color:rgba(224,36,36,.70)!important;
    box-shadow:0 0 20px rgba(255,90,69,.16), inset 0 0 10px rgba(255,90,69,.10)!important;
    background:radial-gradient(circle, rgba(255,255,255,.82), rgba(255,248,243,.32))!important;
  }

  body.light-mode .synapse .core{
    opacity:.72!important;
  }

  body.light-mode .synapse .wire{
    opacity:.90!important;
  }

  body.light-mode .brand small b{
    color:#24130e!important;
  }


  /* Ajuste solicitado: modo claro con cerebro rojo y letras negras en nodos del cerebro */
  body.light-mode #scene{
    opacity:.96!important;
    filter:none!important;
    mix-blend-mode:normal!important;
  }
  body.light-mode .hero-card,
  body.light-mode .bottomnav,
  body.light-mode .ux-search input,
  body.light-mode .ux-results,
  body.light-mode .simple-grid,
  body.light-mode #tip,
  body.light-mode .ux-toolbar{
    background:rgba(255,251,248,.90)!important;
  }


  /* Ajuste fino LIGHT: menos desvanecido, más visible y equilibrado */
  body.light-mode{
    background:
      radial-gradient(118% 92% at 50% 42%, #fff8f5 0%, #f5ece7 40%, #ead8d2 100%)!important;
  }
  body.light-mode #scene{
    opacity:1!important;
    filter:none!important;
    mix-blend-mode:normal!important;
  }
  body.light-mode #scene canvas{
    opacity:1!important;
    filter:contrast(1.10) saturate(1.06)!important;
  }
  body.light-mode .scan{opacity:.02!important}
  body.light-mode .vig{
    background:radial-gradient(120% 90% at 50% 46%, transparent 50%, rgba(215,38,38,.045) 82%, rgba(255,255,255,.30) 100%)!important;
  }
  body.light-mode .hero-card,
  body.light-mode .bottomnav,
  body.light-mode .ux-search input,
  body.light-mode .ux-results,
  body.light-mode .simple-grid,
  body.light-mode #tip,
  body.light-mode .ux-toolbar{
    background:rgba(255,250,247,.88)!important;
    border-color:rgba(215,38,38,.20)!important;
    box-shadow:0 14px 36px rgba(215,38,38,.07)!important;
  }


  /* Tarjeta principal del portafolio: cerrar / volver a abrir */
  .hero-close{
    position:absolute;
    top:10px;
    right:10px;
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    border:1px solid rgba(192,132,252,.42);
    background:rgba(8,4,22,.68);
    color:var(--ink);
    font-size:20px;
    line-height:1;
    cursor:pointer;
    z-index:3;
    clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,7px 100%,0 calc(100% - 7px));
    transition:.2s;
  }
  .hero-close:hover{
    background:var(--v2);
    color:#0b0320;
    box-shadow:0 0 20px rgba(168,85,247,.35);
  }
  body.hero-hidden .hero-card{
    opacity:0!important;
    transform:translateY(18px) scale(.96)!important;
    pointer-events:none!important;
  }
  .hero-open{
    position:fixed;
    left:18px;
    bottom:86px;
    z-index:22;
    display:none;
    padding:11px 15px;
    font-family:var(--fmono);
    font-size:10px;
    letter-spacing:.12em;
    text-transform:uppercase;
    border:1px solid rgba(168,85,247,.45);
    background:rgba(8,4,22,.78);
    color:var(--ink);
    cursor:pointer;
    clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));
    box-shadow:0 16px 44px rgba(0,0,0,.35);
    backdrop-filter:blur(12px);
  }
  body.hero-hidden .hero-open{
    display:block;
  }
  body.light-mode .hero-close,
  body.light-mode .hero-open{
    background:rgba(255,250,247,.92)!important;
    color:#24130e!important;
    border-color:rgba(215,38,38,.28)!important;
    box-shadow:0 12px 28px rgba(215,38,38,.10)!important;
  }
  body.light-mode .hero-close:hover,
  body.light-mode .hero-open:hover{
    background:linear-gradient(135deg,#ff5a45,#ff7a45)!important;
    color:#fff!important;
  }

  @media(max-width:920px){
    .hero-card{
      max-height:calc(100vh - 210px);
      overflow:auto;
    }
    .hero-close{
      top:8px;
      right:8px;
      width:34px;
      height:34px;
      font-size:22px;
    }
    .hero-open{
      left:14px;
      bottom:76px;
    }
  }


  /* FIX: mantener el cuadro del portafolio en su posición original */
  .hero-card{
    position:fixed!important;
    left:30px!important;
    bottom:82px!important;
    z-index:14!important;
  }
  .hero-card .hero-close{
    position:absolute!important;
    top:10px!important;
    right:10px!important;
  }
  @media(max-width:920px){
    .hero-card{
      left:16px!important;
      right:16px!important;
      bottom:82px!important;
      width:auto!important;
      max-height:calc(100vh - 210px);
      overflow:auto;
    }
  }


  /* Botón visible para cerrar cuadro de portafolio */
  .hero-close{
    position:absolute!important;
    top:12px!important;
    right:12px!important;
    width:auto!important;
    min-width:84px!important;
    height:34px!important;
    padding:0 10px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    border:1px solid rgba(255,59,92,.65)!important;
    background:rgba(255,59,92,.16)!important;
    color:#fff!important;
    font-size:14px!important;
    line-height:1!important;
    cursor:pointer!important;
    z-index:99!important;
    clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))!important;
    box-shadow:0 0 18px rgba(255,59,92,.28)!important;
    backdrop-filter:blur(10px)!important;
  }
  .hero-close span{
    font-size:21px!important;
    line-height:1!important;
    font-weight:800!important;
  }
  .hero-close b{
    font-family:var(--fmono)!important;
    font-size:9px!important;
    letter-spacing:.12em!important;
    text-transform:uppercase!important;
  }
  .hero-close:hover{
    background:rgba(255,59,92,.85)!important;
    color:#fff!important;
    transform:translateY(-1px)!important;
  }
  body.light-mode .hero-close{
    background:rgba(217,31,38,.12)!important;
    border-color:rgba(217,31,38,.55)!important;
    color:#d91f26!important;
    box-shadow:0 0 18px rgba(217,31,38,.16)!important;
  }
  body.light-mode .hero-close:hover{
    background:#d91f26!important;
    color:#fff!important;
  }

  @media(max-width:920px){
    .hero-close{
      top:10px!important;
      right:10px!important;
      min-width:92px!important;
      height:38px!important;
    }
    .hero-close span{
      font-size:24px!important;
    }
    .hero-close b{
      font-size:9px!important;
    }
  }


  /* X visible dentro del cuadro del portafolio */
  .hero-card{
    overflow:visible!important;
  }
  .hero-close{
    position:absolute!important;
    top:-16px!important;
    right:-16px!important;
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:50%!important;
    border:2px solid rgba(255,255,255,.9)!important;
    background:#ff3b5c!important;
    color:#fff!important;
    font-size:30px!important;
    font-weight:900!important;
    line-height:1!important;
    cursor:pointer!important;
    z-index:999!important;
    clip-path:none!important;
    box-shadow:0 0 18px rgba(255,59,92,.65),0 8px 24px rgba(0,0,0,.35)!important;
    text-shadow:none!important;
  }
  .hero-close:hover{
    transform:scale(1.08)!important;
    background:#ff1744!important;
    color:#fff!important;
  }
  body.light-mode .hero-close{
    background:#d91f26!important;
    color:#fff!important;
    border-color:#fff!important;
    box-shadow:0 0 18px rgba(217,31,38,.42),0 8px 24px rgba(0,0,0,.18)!important;
  }
  @media(max-width:920px){
    .hero-close{
      top:-14px!important;
      right:-10px!important;
      width:44px!important;
      height:44px!important;
      min-width:44px!important;
      font-size:32px!important;
    }
  }


  /* FIX DEFINITIVO: X fija visible sobre el cuadro del portafolio */
  .hero-close-fixed{
    position:fixed!important;
    left:calc(30px + min(430px, calc(100vw - 60px)) - 18px)!important;
    bottom:calc(82px + 430px - 18px)!important;
    width:44px!important;
    height:44px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    z-index:9999!important;
    border-radius:50%!important;
    border:2px solid #fff!important;
    background:#ff3b5c!important;
    color:#fff!important;
    font-size:32px!important;
    font-weight:900!important;
    line-height:1!important;
    cursor:pointer!important;
    box-shadow:0 0 22px rgba(255,59,92,.75),0 10px 28px rgba(0,0,0,.45)!important;
    text-shadow:none!important;
    clip-path:none!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }
  .hero-close-fixed:hover{
    transform:scale(1.08)!important;
    background:#ff1744!important;
  }
  body.hero-hidden .hero-close-fixed,
  body.panel-open .hero-close-fixed{
    display:none!important;
  }
  body.light-mode .hero-close-fixed{
    background:#d91f26!important;
    color:#fff!important;
    border-color:#fff!important;
    box-shadow:0 0 20px rgba(217,31,38,.48),0 10px 28px rgba(0,0,0,.18)!important;
  }

  @media(max-width:920px){
    .hero-close-fixed{
      left:auto!important;
      right:10px!important;
      bottom:calc(82px + min(430px, calc(100vh - 210px)) - 18px)!important;
      width:46px!important;
      height:46px!important;
      font-size:34px!important;
    }
  }


  /* FIX REAL: X generada y posicionada por JS sobre la esquina del cuadro */
  #heroCloseReal{
    position:fixed!important;
    width:48px!important;
    height:48px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    z-index:2147483647!important;
    border-radius:50%!important;
    border:3px solid #ffffff!important;
    background:#ff1744!important;
    color:#ffffff!important;
    font-size:36px!important;
    font-weight:900!important;
    line-height:1!important;
    cursor:pointer!important;
    box-shadow:0 0 24px rgba(255,23,68,.85),0 12px 30px rgba(0,0,0,.55)!important;
    text-shadow:none!important;
    clip-path:none!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translate(-50%,-50%)!important;
  }
  #heroCloseReal:hover{
    background:#ff3b5c!important;
    transform:translate(-50%,-50%) scale(1.08)!important;
  }
  body.hero-hidden #heroCloseReal,
  body.panel-open #heroCloseReal,
  body.simple-mode #heroCloseReal{
    display:none!important;
  }

  .hero-open{
    position:fixed!important;
    left:18px!important;
    bottom:86px!important;
    z-index:9999!important;
    display:none;
    padding:12px 16px!important;
    font-family:var(--fmono)!important;
    font-size:10px!important;
    letter-spacing:.12em!important;
    text-transform:uppercase!important;
    border:1px solid rgba(168,85,247,.45)!important;
    background:rgba(8,4,22,.86)!important;
    color:var(--ink)!important;
    cursor:pointer!important;
    clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))!important;
    box-shadow:0 16px 44px rgba(0,0,0,.35)!important;
    backdrop-filter:blur(12px)!important;
  }
  body.hero-hidden .hero-open{
    display:block!important;
  }
  body.light-mode .hero-open{
    background:rgba(255,250,247,.94)!important;
    color:#24130e!important;
    border-color:rgba(215,38,38,.30)!important;
  }

  @media(max-width:920px){
    #heroCloseReal{
      width:52px!important;
      height:52px!important;
      font-size:38px!important;
    }
    .hero-open{
      left:14px!important;
      bottom:76px!important;
    }
  }


  /* X acorde al diseño INSIGHT: neón, discreta y solo visible dentro del portafolio */
  #heroCloseReal{
    position:fixed!important;
    width:38px!important;
    height:38px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    z-index:2147483647!important;
    border-radius:0!important;
    border:1px solid rgba(192,132,252,.72)!important;
    background:rgba(12,6,28,.72)!important;
    color:#ece8ff!important;
    font-family:var(--fmono)!important;
    font-size:24px!important;
    font-weight:400!important;
    line-height:1!important;
    cursor:pointer!important;
    box-shadow:0 0 18px rgba(168,85,247,.34), inset 0 0 14px rgba(168,85,247,.12)!important;
    text-shadow:0 0 10px rgba(232,121,249,.65)!important;
    clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,9px 100%,0 calc(100% - 9px))!important;
    opacity:.92!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translate(-50%,-50%)!important;
    backdrop-filter:blur(10px)!important;
  }
  #heroCloseReal::before{
    content:'';
    position:absolute;
    inset:5px;
    border:1px solid rgba(34,211,238,.25);
    clip-path:inherit;
    pointer-events:none;
  }
  #heroCloseReal:hover{
    background:rgba(168,85,247,.25)!important;
    border-color:rgba(34,211,238,.85)!important;
    color:#22d3ee!important;
    transform:translate(-50%,-50%) scale(1.06)!important;
    box-shadow:0 0 24px rgba(34,211,238,.34), inset 0 0 18px rgba(34,211,238,.10)!important;
  }

  /* No mostrar la X en pantalla inicial / intro */
  body:not(.entered) #heroCloseReal,
  body.hero-hidden #heroCloseReal,
  body.panel-open #heroCloseReal,
  body.simple-mode #heroCloseReal{
    display:none!important;
  }

  body.light-mode #heroCloseReal{
    background:rgba(255,250,247,.92)!important;
    color:#d91f26!important;
    border-color:rgba(217,31,38,.42)!important;
    text-shadow:none!important;
    box-shadow:0 0 16px rgba(217,31,38,.14), inset 0 0 10px rgba(217,31,38,.06)!important;
  }
  body.light-mode #heroCloseReal::before{
    border-color:rgba(217,31,38,.18)!important;
  }
  body.light-mode #heroCloseReal:hover{
    background:rgba(217,31,38,.10)!important;
    border-color:rgba(217,31,38,.72)!important;
    color:#9f1239!important;
  }

  .hero-open{
    border-color:rgba(192,132,252,.45)!important;
    background:rgba(12,6,28,.78)!important;
    color:#ece8ff!important;
    box-shadow:0 16px 44px rgba(0,0,0,.35),0 0 20px rgba(168,85,247,.18)!important;
  }
  .hero-open:hover{
    border-color:rgba(34,211,238,.75)!important;
    color:#22d3ee!important;
  }

  @media(max-width:920px){
    #heroCloseReal{
      width:40px!important;
      height:40px!important;
      font-size:26px!important;
    }
  }


  /* Nodo especial: experiencia */
  .synapse.special-exp{width:380px}
  .synapse.special-exp .dot{width:84px;height:84px}
  .synapse.special-exp .ring{
    border-width:1.5px;
    box-shadow:0 0 30px color-mix(in srgb,var(--c) 85%,transparent), inset 0 0 18px color-mix(in srgb,var(--c) 28%,transparent);
    background:
      radial-gradient(circle at 50% 50%, color-mix(in srgb,var(--c) 18%,rgba(8,4,22,.84)), rgba(8,4,22,.94));
  }
  .synapse.special-exp .ring2{opacity:.38}
  .synapse.special-exp .ring3{opacity:.22}
  .synapse.special-exp .core{
    width:24px;height:24px;opacity:.72;
    background:radial-gradient(circle,color-mix(in srgb,var(--c) 92%,white 8%),transparent 70%);
  }
  .synapse.special-exp .dot svg.ic{
    width:32px;height:32px;stroke-width:1.7;
    filter:drop-shadow(0 0 10px var(--c));
  }
  .synapse.special-exp .lbl{
    font-size:12px;
    letter-spacing:.15em;
    font-weight:700;
  }
  .synapse.special-exp .num{
    color:#ffd49a;
  }
  .synapse.special-exp .wire{
    opacity:.9;height:2px;
  }
  .synapse.special-exp::after{
    content:'NODO ESPECIAL';
    position:absolute;
    right:86px; top:-16px;
    font-family:var(--fmono);
    font-size:9px;
    letter-spacing:.16em;
    color:color-mix(in srgb,var(--c) 85%,white 15%);
    opacity:.86;
  }
  body.light-mode .synapse.special-exp .lbl{color:#1d120c;text-shadow:none}
  body.light-mode .synapse.special-exp .num{color:#b45309}
  body.light-mode .synapse.special-exp::after{color:#b45309}

  /* Panel de experiencia */
  .exp-badge{
    display:grid;
    grid-template-columns:92px 1fr;
    gap:18px;
    padding:18px;
    margin:16px 0 18px;
    border:1px solid rgba(255,180,84,.28);
    background:linear-gradient(180deg, rgba(255,180,84,.10), rgba(255,180,84,.04));
    clip-path:var(--notch);
  }
  .exp-badge .seal{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
    min-height:92px;
    border:1px solid rgba(255,180,84,.28);
    background:rgba(255,180,84,.08);
    clip-path:var(--notch);
  }
  .exp-badge .seal svg{
    width:38px;height:38px;stroke:#ffb454;fill:none;stroke-width:1.6;
    filter:drop-shadow(0 0 10px rgba(255,180,84,.35));
  }
  .exp-badge .seal span{
    font-family:var(--fmono);font-size:10px;letter-spacing:.16em;color:#ffd49a;
  }
  .exp-badge .tag, .exp-card .tag{
    display:inline-block;
    margin-bottom:8px;
    font-family:var(--fmono);
    font-size:10px;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#ffb454;
  }
  .exp-badge h4{
    margin:0 0 8px;font-size:20px;color:var(--ink)
  }
  .exp-badge p{margin:0;color:var(--dim);line-height:1.75}
  .exp-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
  }
  .exp-card{
    padding:16px;
    border:1px solid rgba(255,180,84,.18);
    background:rgba(255,255,255,.02);
    clip-path:var(--notch);
  }
  .exp-top{
    display:flex;gap:12px;justify-content:space-between;align-items:flex-start;margin-bottom:10px;
  }
  .exp-card h4{
    margin:0;
    font-size:18px;
    line-height:1.25;
    color:var(--ink);
  }
  .exp-time{
    white-space:nowrap;
    font-family:var(--fmono);
    font-size:10px;
    letter-spacing:.13em;
    color:#ffd49a;
    border:1px solid rgba(255,180,84,.22);
    background:rgba(255,180,84,.08);
    padding:6px 8px;
    clip-path:var(--notch);
  }
  .exp-area{
    margin-bottom:10px;
    color:#f2e7d2;
    font-size:13px;
    line-height:1.55;
  }
  .exp-card p{
    margin:0;
    color:var(--dim);
    line-height:1.72;
  }
  body.light-mode .exp-badge{
    background:linear-gradient(180deg, rgba(217,119,6,.09), rgba(217,119,6,.03))!important;
    border-color:rgba(217,119,6,.24)!important;
  }
  body.light-mode .exp-badge .seal,
  body.light-mode .exp-card{
    background:rgba(255,255,255,.86)!important;
    border-color:rgba(217,119,6,.20)!important;
  }
  body.light-mode .exp-badge .seal svg{stroke:#c2410c!important;filter:none}
  body.light-mode .exp-badge .seal span,
  body.light-mode .exp-badge .tag,
  body.light-mode .exp-card .tag,
  body.light-mode .exp-time{color:#c2410c!important}
  body.light-mode .exp-area{color:#4b2c1b!important}
  @media(max-width:920px){
    .exp-badge{grid-template-columns:1fr}
    .exp-grid{grid-template-columns:1fr}
    .synapse.special-exp{width:340px}
    .synapse.special-exp .wire{width:240px!important}
  }


  /* Upgrade premium del nodo especial Experiencia */
  .synapse.special-exp{
    width:420px;
    filter:drop-shadow(0 0 24px rgba(255,180,84,.16));
  }
  .synapse.special-exp .dot{
    width:92px;height:92px;
  }
  .synapse.special-exp .ring{
    border-width:1.7px;
    box-shadow:
      0 0 34px color-mix(in srgb,var(--c) 88%,transparent),
      inset 0 0 18px color-mix(in srgb,var(--c) 34%,transparent);
    animation:specialPulse 2.8s ease-in-out infinite;
  }
  .synapse.special-exp .ring2{
    opacity:.52;
    animation:synp 2.2s ease-in-out infinite;
  }
  .synapse.special-exp .ring3{
    opacity:.28;
    animation:synp2 3.8s ease-in-out infinite;
  }
  .synapse.special-exp .core{
    width:26px;height:26px;opacity:.82;
    animation:nodeCore 1.9s ease-in-out infinite;
  }
  .synapse.special-exp .special-glow{
    position:absolute;
    inset:-18px;
    border-radius:50%;
    background:radial-gradient(circle, color-mix(in srgb,var(--c) 18%,transparent), transparent 68%);
    filter:blur(10px);
    animation:specialBreath 3.2s ease-in-out infinite;
    pointer-events:none;
  }
  .synapse.special-exp .orbit{
    position:absolute;
    width:10px;height:10px;border-radius:50%;
    background:var(--c);
    box-shadow:0 0 10px var(--c),0 0 20px color-mix(in srgb,var(--c) 72%,white 28%);
    z-index:2;
    opacity:.9;
  }
  .synapse.special-exp .orbit.o1{animation:orbA 4.2s linear infinite}
  .synapse.special-exp .orbit.o2{animation:orbB 5.1s linear infinite}
  .synapse.special-exp .orbit.o3{animation:orbC 3.6s linear infinite}
  .synapse.special-exp .dot svg.ic{
    width:34px;height:34px;
    filter:drop-shadow(0 0 12px var(--c));
  }
  .synapse.special-exp .lbl{
    font-size:13px;
    letter-spacing:.16em;
    font-weight:700;
  }
  .synapse.special-exp .wire{
    opacity:.96;
    height:2px;
  }
  .synapse.special-exp .wire::after{
    width:32px;
    filter:blur(.6px);
    animation:wirePulse 2.4s linear infinite;
  }
  .synapse.special-exp::after{
    content:'NODO ESPECIAL';
    position:absolute;
    right:86px;top:-17px;
    font-family:var(--fmono);
    font-size:9px;
    letter-spacing:.17em;
    color:#ffd49a;
    opacity:.94;
  }
  @keyframes specialPulse{
    0%,100%{transform:scale(1);opacity:.92}
    50%{transform:scale(1.06);opacity:1}
  }
  @keyframes specialBreath{
    0%,100%{transform:scale(.96);opacity:.45}
    50%{transform:scale(1.08);opacity:.72}
  }
  @keyframes orbA{
    0%{transform:rotate(0deg) translateX(44px) rotate(0deg)}
    100%{transform:rotate(360deg) translateX(44px) rotate(-360deg)}
  }
  @keyframes orbB{
    0%{transform:rotate(120deg) translateX(34px) rotate(0deg)}
    100%{transform:rotate(480deg) translateX(34px) rotate(-360deg)}
  }
  @keyframes orbC{
    0%{transform:rotate(240deg) translateX(52px) rotate(0deg)}
    100%{transform:rotate(600deg) translateX(52px) rotate(-360deg)}
  }

  /* Upgrade visual del panel de experiencia */
  .exp-badge{
    position:relative;
    overflow:hidden;
  }
  .exp-badge::before{
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,.03) 30%, transparent 60%);
    transform:translateX(-100%);
    animation:expSweep 6s linear infinite;
    pointer-events:none;
  }
  .exp-mini-flags{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
  }
  .exp-mini-flags span{
    padding:7px 10px;
    border:1px solid rgba(255,180,84,.22);
    background:rgba(255,180,84,.08);
    clip-path:var(--notch);
    font-family:var(--fmono);
    font-size:10px;
    letter-spacing:.12em;
    color:#ffd49a;
    text-transform:uppercase;
  }
  .exp-grid{
    gap:16px;
  }
  .exp-card{
    position:relative;
    padding:18px 16px 16px 16px;
    background:
      linear-gradient(180deg, rgba(255,180,84,.06), rgba(255,255,255,.02));
    transition:transform .25s, box-shadow .25s, border-color .25s;
  }
  .exp-card:hover{
    transform:translateY(-4px);
    border-color:rgba(255,180,84,.34);
    box-shadow:0 18px 34px rgba(0,0,0,.18), 0 0 20px rgba(255,180,84,.08);
  }
  .exp-mark{
    position:absolute;
    top:14px;right:14px;
    width:38px;height:38px;
    display:flex;align-items:center;justify-content:center;
    border:1px solid rgba(255,180,84,.26);
    background:rgba(255,180,84,.10);
    clip-path:var(--notch);
    font-family:var(--fmono);
    font-size:12px;
    letter-spacing:.14em;
    color:#ffcf8a;
  }
  .exp-card h4{
    padding-right:52px;
  }
  @keyframes expSweep{
    0%{transform:translateX(-110%)}
    100%{transform:translateX(110%)}
  }

  body.light-mode .exp-mini-flags span,
  body.light-mode .exp-mark{
    color:#b45309!important;
    background:rgba(217,119,6,.08)!important;
    border-color:rgba(217,119,6,.20)!important;
  }
  body.light-mode .exp-card{
    background:linear-gradient(180deg, rgba(217,119,6,.05), rgba(255,255,255,.86))!important;
  }
  body.light-mode .synapse.special-exp .lbl{color:#1d120c!important;text-shadow:none}
  body.light-mode .synapse.special-exp .num,
  body.light-mode .synapse.special-exp::after{color:#b45309!important}
  @media(max-width:920px){
    .synapse.special-exp{width:360px}
    .synapse.special-exp .wire{width:250px!important}
  }


  /* FIX visual: nodo Experiencia claramente visible afuera del cerebro */
  #synapses .synapse.special-exp.exp-fixed{
    position:fixed!important;
    right:3.2%!important;
    top:56%!important;
    width:430px!important;
    z-index:26!important;
    opacity:1!important;
    visibility:visible!important;
    transform:none!important;
  }
  #synapses .synapse.special-exp.exp-fixed .dot{
    width:96px!important;
    height:96px!important;
  }
  #synapses .synapse.special-exp.exp-fixed .lbl{
    left:110px!important;
    font-size:13px!important;
    color:#fff6e8!important;
    text-shadow:0 0 14px rgba(0,0,0,.88), 0 0 18px rgba(255,180,84,.20)!important;
  }
  #synapses .synapse.special-exp.exp-fixed .num{
    left:110px!important;
    top:-2px!important;
    font-size:10px!important;
    color:#ffcf8a!important;
  }
  #synapses .synapse.special-exp.exp-fixed .wire{
    right:84px!important;
    width:250px!important;
    opacity:.98!important;
  }
  #synapses .synapse.special-exp.exp-fixed .wire::before{
    background:linear-gradient(90deg, rgba(255,180,84,.96), transparent)!important;
  }
  #synapses .synapse.special-exp.exp-fixed::after{
    right:110px!important;
    top:-18px!important;
  }

  /* Mantenerlo al lado del cerebro y no debajo de la navegación en móvil */
  @media(max-width:920px){
    #synapses .synapse.special-exp.exp-fixed{
      right:14px!important;
      top:74%!important;
      width:300px!important;
      transform:scale(.92)!important;
      transform-origin:right center!important;
    }
    #synapses .synapse.special-exp.exp-fixed .wire{
      width:180px!important;
      right:78px!important;
    }
    #synapses .synapse.special-exp.exp-fixed .lbl,
    #synapses .synapse.special-exp.exp-fixed .num{
      left:96px!important;
    }
  }

  body.light-mode #synapses .synapse.special-exp.exp-fixed .lbl{
    color:#25140d!important;
    text-shadow:none!important;
  }
  body.light-mode #synapses .synapse.special-exp.exp-fixed .num{
    color:#b45309!important;
  }


  /* Asegurar render visible del contenedor de nodos */
  #synapses{
    position:fixed!important;
    inset:0!important;
    z-index:16!important;
    pointer-events:none!important;
    overflow:visible!important;
  }
  #synapses .synapse{pointer-events:auto!important}

  /* Nodo experiencia fijo, visible y claramente afuera del cerebro */
  #synapses .synapse.special-exp.exp-fixed{
    right:2.2%!important;
    top:58%!important;
    width:420px!important;
    display:block!important;
    opacity:1!important;
    visibility:visible!important;
  }
  #synapses .synapse.special-exp.exp-fixed .dot{
    width:92px!important;
    height:92px!important;
  }
  #synapses .synapse.special-exp.exp-fixed .wire{
    width:250px!important;
    right:82px!important;
  }
  #synapses .synapse.special-exp.exp-fixed .lbl{
    left:106px!important;
    color:#fff6e8!important;
    font-size:13px!important;
  }
  #synapses .synapse.special-exp.exp-fixed .num{
    left:106px!important;
    top:0!important;
  }

  @media(max-width:920px){
    #synapses .synapse.special-exp.exp-fixed{
      right:8px!important;
      top:73%!important;
      width:290px!important;
    }
    #synapses .synapse.special-exp.exp-fixed .wire{
      width:170px!important;
      right:74px!important;
    }
    #synapses .synapse.special-exp.exp-fixed .lbl,
    #synapses .synapse.special-exp.exp-fixed .num{
      left:92px!important;
    }
  }


  /* Ajuste: mover 'Sobre mí' a la izquierda */
  #synapses .synapse[data-node="about"]{
    left:2.6%!important;
    right:auto!important;
    top:38%!important;
    width:340px!important;
    z-index:20!important;
  }
  #synapses .synapse[data-node="about"] .wire{
    left:82px!important;
    right:auto!important;
    width:210px!important;
  }
  #synapses .synapse[data-node="about"] .lbl{
    right:96px!important;
    left:auto!important;
  }
  #synapses .synapse[data-node="about"] .num{
    right:96px!important;
    left:auto!important;
  }

  @media(max-width:920px){
    #synapses .synapse[data-node="about"]{
      left:10px!important;
      top:28%!important;
      width:280px!important;
      transform:scale(.92)!important;
      transform-origin:left center!important;
    }
    #synapses .synapse[data-node="about"] .wire{
      width:150px!important;
      left:72px!important;
    }
    #synapses .synapse[data-node="about"] .lbl,
    #synapses .synapse[data-node="about"] .num{
      right:86px!important;
    }
  }


  /* LAYOUT FINAL DE NODOS EXTERNOS — sin superposición */
  #synapses{
    position:fixed!important;
    inset:0!important;
    z-index:16!important;
    pointer-events:none!important;
    overflow:visible!important;
  }
  #synapses .synapse{
    pointer-events:auto!important;
    opacity:1!important;
    visibility:visible!important;
  }

  /* SOBRE MÍ — izquierda, visible y texto hacia adentro */
  #synapses .synapse[data-node="about"]{
    position:fixed!important;
    left:2.2%!important;
    right:auto!important;
    top:34%!important;
    width:390px!important;
    z-index:22!important;
    transform:none!important;
  }
  #synapses .synapse[data-node="about"] .dot{
    position:absolute!important;
    left:0!important;
    right:auto!important;
    top:6px!important;
    width:74px!important;
    height:74px!important;
  }
  #synapses .synapse[data-node="about"] .lbl{
    left:92px!important;
    right:auto!important;
    width:210px!important;
    text-align:left!important;
    color:#fff!important;
    font-size:13px!important;
    text-shadow:0 0 14px rgba(0,0,0,.9),0 0 18px rgba(192,132,252,.24)!important;
  }
  #synapses .synapse[data-node="about"] .num{
    left:92px!important;
    right:auto!important;
    width:210px!important;
    text-align:left!important;
    color:#c084fc!important;
  }
  #synapses .synapse[data-node="about"] .wire{
    left:72px!important;
    right:auto!important;
    width:250px!important;
    opacity:.78!important;
  }
  #synapses .synapse[data-node="about"] .wire::before{
    background:linear-gradient(90deg, var(--c), transparent)!important;
  }

  /* SERVICIOS — derecha arriba */
  #synapses .synapse[data-node="servicios"]{
    position:fixed!important;
    right:2.2%!important;
    left:auto!important;
    top:28%!important;
    width:410px!important;
    z-index:22!important;
    transform:none!important;
  }

  /* SKILLS — derecha centro */
  #synapses .synapse[data-node="skills"]{
    position:fixed!important;
    right:2.2%!important;
    left:auto!important;
    top:50%!important;
    width:410px!important;
    z-index:22!important;
    transform:none!important;
  }

  /* EXPERIENCIA — derecha abajo, nodo especial separado */
  #synapses .synapse[data-node="experiencia"]{
    position:fixed!important;
    right:2.2%!important;
    left:auto!important;
    top:73%!important;
    width:430px!important;
    z-index:24!important;
    transform:none!important;
    filter:drop-shadow(0 0 24px rgba(255,180,84,.18))!important;
  }

  /* Configuración común de nodos derechos: texto hacia el cerebro, círculo externo */
  #synapses .synapse[data-node="servicios"] .dot,
  #synapses .synapse[data-node="skills"] .dot,
  #synapses .synapse[data-node="experiencia"] .dot{
    position:absolute!important;
    right:0!important;
    left:auto!important;
    top:6px!important;
  }
  #synapses .synapse[data-node="servicios"] .lbl,
  #synapses .synapse[data-node="skills"] .lbl,
  #synapses .synapse[data-node="experiencia"] .lbl{
    left:auto!important;
    right:104px!important;
    width:220px!important;
    text-align:right!important;
    color:#fff!important;
    text-shadow:0 0 14px rgba(0,0,0,.9),0 0 18px color-mix(in srgb,var(--c) 24%,transparent)!important;
  }
  #synapses .synapse[data-node="servicios"] .num,
  #synapses .synapse[data-node="skills"] .num,
  #synapses .synapse[data-node="experiencia"] .num{
    left:auto!important;
    right:104px!important;
    width:220px!important;
    text-align:right!important;
  }
  #synapses .synapse[data-node="servicios"] .wire,
  #synapses .synapse[data-node="skills"] .wire,
  #synapses .synapse[data-node="experiencia"] .wire{
    left:auto!important;
    right:78px!important;
    width:260px!important;
    opacity:.82!important;
  }
  #synapses .synapse[data-node="servicios"] .wire::before,
  #synapses .synapse[data-node="skills"] .wire::before,
  #synapses .synapse[data-node="experiencia"] .wire::before{
    background:linear-gradient(270deg, var(--c), transparent)!important;
  }

  #synapses .synapse[data-node="experiencia"] .dot{
    width:92px!important;
    height:92px!important;
  }
  #synapses .synapse[data-node="experiencia"] .lbl{
    right:118px!important;
    font-size:13px!important;
  }
  #synapses .synapse[data-node="experiencia"] .num{
    right:118px!important;
    color:#ffd49a!important;
  }
  #synapses .synapse[data-node="experiencia"] .wire{
    right:92px!important;
    width:270px!important;
  }
  #synapses .synapse[data-node="experiencia"]::after{
    right:118px!important;
    top:-18px!important;
  }

  body.light-mode #synapses .synapse .lbl{
    color:#1d120c!important;
    text-shadow:none!important;
  }

  @media(max-width:920px){
    #synapses .synapse[data-node="about"]{
      left:10px!important;
      top:26%!important;
      width:285px!important;
      transform:scale(.88)!important;
      transform-origin:left center!important;
    }
    #synapses .synapse[data-node="servicios"]{
      right:8px!important;
      top:36%!important;
      width:300px!important;
      transform:scale(.88)!important;
      transform-origin:right center!important;
    }
    #synapses .synapse[data-node="skills"]{
      right:8px!important;
      top:55%!important;
      width:300px!important;
      transform:scale(.88)!important;
      transform-origin:right center!important;
    }
    #synapses .synapse[data-node="experiencia"]{
      right:8px!important;
      top:74%!important;
      width:320px!important;
      transform:scale(.84)!important;
      transform-origin:right center!important;
    }
    #synapses .synapse .wire{
      width:150px!important;
    }
    #synapses .synapse[data-node="about"] .lbl,
    #synapses .synapse[data-node="about"] .num{
      left:84px!important;
      width:160px!important;
    }
    #synapses .synapse[data-node="servicios"] .lbl,
    #synapses .synapse[data-node="skills"] .lbl,
    #synapses .synapse[data-node="experiencia"] .lbl,
    #synapses .synapse[data-node="servicios"] .num,
    #synapses .synapse[data-node="skills"] .num,
    #synapses .synapse[data-node="experiencia"] .num{
      right:92px!important;
      width:150px!important;
    }
  }


  /* LAYOUT REORDENADO Y MÁS SEPARADO */
  #synapses{
    position:fixed!important;
    inset:0!important;
    z-index:16!important;
    pointer-events:none!important;
    overflow:visible!important;
  }
  #synapses .synapse{
    pointer-events:auto!important;
    opacity:1!important;
    visibility:visible!important;
  }

  /* SOBRE MÍ arriba del cuadro, a la izquierda */
  #synapses .synapse[data-node="about"]{
    position:fixed!important;
    left:1.8%!important;
    right:auto!important;
    top:18%!important;
    width:320px!important;
    z-index:22!important;
    transform:none!important;
  }
  #synapses .synapse[data-node="about"] .dot{
    position:absolute!important;
    left:0!important;
    right:auto!important;
    top:4px!important;
    width:70px!important;
    height:70px!important;
  }
  #synapses .synapse[data-node="about"] .lbl{
    left:86px!important;
    right:auto!important;
    width:180px!important;
    text-align:left!important;
    color:#fff!important;
    font-size:13px!important;
    text-shadow:0 0 14px rgba(0,0,0,.9),0 0 18px rgba(192,132,252,.24)!important;
  }
  #synapses .synapse[data-node="about"] .num{
    left:86px!important;
    right:auto!important;
    width:180px!important;
    text-align:left!important;
    color:#c084fc!important;
  }
  #synapses .synapse[data-node="about"] .wire{
    left:68px!important;
    right:auto!important;
    width:180px!important;
    opacity:.78!important;
  }
  #synapses .synapse[data-node="about"] .wire::before{
    background:linear-gradient(90deg, var(--c), transparent)!important;
  }

  /* Configuración común nodos derechos */
  #synapses .synapse[data-node="servicios"],
  #synapses .synapse[data-node="skills"],
  #synapses .synapse[data-node="experiencia"]{
    position:fixed!important;
    right:2.4%!important;
    left:auto!important;
    width:420px!important;
    z-index:22!important;
    transform:none!important;
  }
  #synapses .synapse[data-node="servicios"]{ top:24%!important; }
  #synapses .synapse[data-node="skills"]{ top:50%!important; }
  #synapses .synapse[data-node="experiencia"]{
    top:76%!important;
    z-index:24!important;
  }

  #synapses .synapse[data-node="servicios"] .dot,
  #synapses .synapse[data-node="skills"] .dot,
  #synapses .synapse[data-node="experiencia"] .dot{
    position:absolute!important;
    right:0!important;
    left:auto!important;
    top:4px!important;
  }
  #synapses .synapse[data-node="servicios"] .lbl,
  #synapses .synapse[data-node="skills"] .lbl,
  #synapses .synapse[data-node="experiencia"] .lbl{
    left:auto!important;
    right:102px!important;
    width:220px!important;
    text-align:right!important;
    color:#fff!important;
    font-size:13px!important;
    text-shadow:0 0 14px rgba(0,0,0,.9),0 0 18px color-mix(in srgb,var(--c) 24%,transparent)!important;
  }
  #synapses .synapse[data-node="servicios"] .num,
  #synapses .synapse[data-node="skills"] .num,
  #synapses .synapse[data-node="experiencia"] .num{
    left:auto!important;
    right:102px!important;
    width:220px!important;
    text-align:right!important;
  }
  #synapses .synapse[data-node="servicios"] .wire,
  #synapses .synapse[data-node="skills"] .wire,
  #synapses .synapse[data-node="experiencia"] .wire{
    left:auto!important;
    right:80px!important;
    width:250px!important;
    opacity:.82!important;
  }
  #synapses .synapse[data-node="servicios"] .wire::before,
  #synapses .synapse[data-node="skills"] .wire::before,
  #synapses .synapse[data-node="experiencia"] .wire::before{
    background:linear-gradient(270deg, var(--c), transparent)!important;
  }

  /* Experiencia un poco más premium */
  #synapses .synapse[data-node="experiencia"] .dot{
    width:92px!important;
    height:92px!important;
  }
  #synapses .synapse[data-node="experiencia"] .lbl{
    right:116px!important;
    width:230px!important;
  }
  #synapses .synapse[data-node="experiencia"] .num{
    right:116px!important;
    color:#ffd49a!important;
  }
  #synapses .synapse[data-node="experiencia"] .wire{
    right:92px!important;
    width:270px!important;
  }
  #synapses .synapse[data-node="experiencia"]::after{
    right:116px!important;
    top:-18px!important;
  }

  body.light-mode #synapses .synapse .lbl{
    color:#1d120c!important;
    text-shadow:none!important;
  }

  @media(max-width:920px){
    #synapses .synapse[data-node="about"]{
      left:10px!important;
      top:16%!important;
      width:250px!important;
      transform:scale(.84)!important;
      transform-origin:left center!important;
    }
    #synapses .synapse[data-node="servicios"]{
      right:8px!important;
      top:34%!important;
      width:280px!important;
      transform:scale(.84)!important;
      transform-origin:right center!important;
    }
    #synapses .synapse[data-node="skills"]{
      right:8px!important;
      top:54%!important;
      width:280px!important;
      transform:scale(.84)!important;
      transform-origin:right center!important;
    }
    #synapses .synapse[data-node="experiencia"]{
      right:8px!important;
      top:74%!important;
      width:300px!important;
      transform:scale(.80)!important;
      transform-origin:right center!important;
    }
    #synapses .synapse .wire{ width:140px!important; }
    #synapses .synapse[data-node="about"] .lbl,
    #synapses .synapse[data-node="about"] .num{
      left:80px!important;
      width:140px!important;
    }
    #synapses .synapse[data-node="servicios"] .lbl,
    #synapses .synapse[data-node="skills"] .lbl,
    #synapses .synapse[data-node="experiencia"] .lbl,
    #synapses .synapse[data-node="servicios"] .num,
    #synapses .synapse[data-node="skills"] .num,
    #synapses .synapse[data-node="experiencia"] .num{
      right:88px!important;
      width:145px!important;
    }
  }


  /* LAYOUT FINAL — experiencia primero, luego servicios y skills */
  #synapses{
    position:fixed!important;
    inset:0!important;
    z-index:16!important;
    pointer-events:none!important;
    overflow:visible!important;
  }
  #synapses .synapse{
    pointer-events:auto!important;
    opacity:1!important;
    visibility:visible!important;
  }

  /* SOBRE MÍ arriba del cuadro, a la izquierda */
  #synapses .synapse[data-node="about"]{
    position:fixed!important;
    left:1.8%!important;
    right:auto!important;
    top:18%!important;
    width:320px!important;
    z-index:22!important;
    transform:none!important;
  }
  #synapses .synapse[data-node="about"] .dot{
    position:absolute!important;
    left:0!important;
    right:auto!important;
    top:4px!important;
    width:70px!important;
    height:70px!important;
  }
  #synapses .synapse[data-node="about"] .lbl{
    left:86px!important;
    right:auto!important;
    width:180px!important;
    text-align:left!important;
    color:#fff!important;
    font-size:13px!important;
    text-shadow:0 0 14px rgba(0,0,0,.9),0 0 18px rgba(192,132,252,.24)!important;
  }
  #synapses .synapse[data-node="about"] .num{
    left:86px!important;
    right:auto!important;
    width:180px!important;
    text-align:left!important;
    color:#c084fc!important;
  }
  #synapses .synapse[data-node="about"] .wire{
    left:68px!important;
    right:auto!important;
    width:180px!important;
    opacity:.78!important;
  }
  #synapses .synapse[data-node="about"] .wire::before{
    background:linear-gradient(90deg, var(--c), transparent)!important;
  }

  /* Configuración común de los 3 nodos derechos */
  #synapses .synapse[data-node="experiencia"],
  #synapses .synapse[data-node="servicios"],
  #synapses .synapse[data-node="skills"]{
    position:fixed!important;
    right:2.4%!important;
    left:auto!important;
    width:420px!important;
    z-index:22!important;
    transform:none!important;
  }
  /* Distancias iguales: 24%, 50%, 76% */
  #synapses .synapse[data-node="experiencia"]{ top:24%!important; z-index:24!important; }
  #synapses .synapse[data-node="servicios"]{ top:50%!important; }
  #synapses .synapse[data-node="skills"]{ top:76%!important; }

  #synapses .synapse[data-node="experiencia"] .dot,
  #synapses .synapse[data-node="servicios"] .dot,
  #synapses .synapse[data-node="skills"] .dot{
    position:absolute!important;
    right:0!important;
    left:auto!important;
    top:4px!important;
  }
  #synapses .synapse[data-node="experiencia"] .lbl,
  #synapses .synapse[data-node="servicios"] .lbl,
  #synapses .synapse[data-node="skills"] .lbl{
    left:auto!important;
    right:102px!important;
    width:220px!important;
    text-align:right!important;
    color:#fff!important;
    font-size:13px!important;
    text-shadow:0 0 14px rgba(0,0,0,.9),0 0 18px color-mix(in srgb,var(--c) 24%,transparent)!important;
  }
  #synapses .synapse[data-node="experiencia"] .num,
  #synapses .synapse[data-node="servicios"] .num,
  #synapses .synapse[data-node="skills"] .num{
    left:auto!important;
    right:102px!important;
    width:220px!important;
    text-align:right!important;
  }
  #synapses .synapse[data-node="experiencia"] .wire,
  #synapses .synapse[data-node="servicios"] .wire,
  #synapses .synapse[data-node="skills"] .wire{
    left:auto!important;
    right:80px!important;
    width:250px!important;
    opacity:.82!important;
  }
  #synapses .synapse[data-node="experiencia"] .wire::before,
  #synapses .synapse[data-node="servicios"] .wire::before,
  #synapses .synapse[data-node="skills"] .wire::before{
    background:linear-gradient(270deg, var(--c), transparent)!important;
  }

  /* Experiencia especial */
  #synapses .synapse[data-node="experiencia"] .dot{
    width:92px!important;
    height:92px!important;
  }
  #synapses .synapse[data-node="experiencia"] .lbl{
    right:116px!important;
    width:230px!important;
  }
  #synapses .synapse[data-node="experiencia"] .num{
    right:116px!important;
    color:#ffd49a!important;
  }
  #synapses .synapse[data-node="experiencia"] .wire{
    right:92px!important;
    width:270px!important;
  }
  #synapses .synapse[data-node="experiencia"]::after{
    right:116px!important;
    top:-18px!important;
  }

  body.light-mode #synapses .synapse .lbl{
    color:#1d120c!important;
    text-shadow:none!important;
  }

  @media(max-width:920px){
    #synapses .synapse[data-node="about"]{
      left:10px!important;
      top:16%!important;
      width:250px!important;
      transform:scale(.84)!important;
      transform-origin:left center!important;
    }
    #synapses .synapse[data-node="experiencia"]{
      right:8px!important;
      top:28%!important;
      width:300px!important;
      transform:scale(.80)!important;
      transform-origin:right center!important;
    }
    #synapses .synapse[data-node="servicios"]{
      right:8px!important;
      top:50%!important;
      width:280px!important;
      transform:scale(.84)!important;
      transform-origin:right center!important;
    }
    #synapses .synapse[data-node="skills"]{
      right:8px!important;
      top:72%!important;
      width:280px!important;
      transform:scale(.84)!important;
      transform-origin:right center!important;
    }
    #synapses .synapse .wire{ width:140px!important; }
    #synapses .synapse[data-node="about"] .lbl,
    #synapses .synapse[data-node="about"] .num{
      left:80px!important;
      width:140px!important;
    }
    #synapses .synapse[data-node="experiencia"] .lbl,
    #synapses .synapse[data-node="servicios"] .lbl,
    #synapses .synapse[data-node="skills"] .lbl,
    #synapses .synapse[data-node="experiencia"] .num,
    #synapses .synapse[data-node="servicios"] .num,
    #synapses .synapse[data-node="skills"] .num{
      right:88px!important;
      width:145px!important;
    }
  }


  /* ORGANIZACIÓN REAL DE NODOS — columna limpia a la derecha */
  #synapses{
    position:fixed!important;
    inset:0!important;
    z-index:16!important;
    pointer-events:none!important;
    overflow:visible!important;
  }
  #synapses .synapse{
    pointer-events:auto!important;
    opacity:1!important;
    visibility:visible!important;
  }

  /* Sobre mí: arriba del cuadro, a la izquierda */
  #synapses .synapse[data-node="about"]{
    position:fixed!important;
    left:1.8%!important;
    right:auto!important;
    top:17%!important;
    width:300px!important;
    z-index:22!important;
    transform:none!important;
  }
  #synapses .synapse[data-node="about"] .dot{
    left:0!important; right:auto!important; top:6px!important;
    width:70px!important; height:70px!important;
  }
  #synapses .synapse[data-node="about"] .wire{
    left:66px!important; right:auto!important; width:170px!important;
  }
  #synapses .synapse[data-node="about"] .lbl,
  #synapses .synapse[data-node="about"] .num{
    left:84px!important; right:auto!important; width:160px!important; text-align:left!important;
  }
  #synapses .synapse[data-node="about"] .lbl{
    color:#fff!important;
    text-shadow:0 0 14px rgba(0,0,0,.86),0 0 16px rgba(192,132,252,.20)!important;
  }
  #synapses .synapse[data-node="about"] .num{ color:#c084fc!important; }

  /* Columna derecha */
  #synapses .synapse[data-node="experiencia"],
  #synapses .synapse[data-node="servicios"],
  #synapses .synapse[data-node="skills"]{
    position:fixed!important;
    right:2.0%!important;
    left:auto!important;
    width:390px!important;
    z-index:22!important;
    transform:none!important;
  }

  /* Orden y aire entre nodos */
  #synapses .synapse[data-node="experiencia"]{ top:26%!important; z-index:24!important; }
  #synapses .synapse[data-node="servicios"]{ top:50%!important; }
  #synapses .synapse[data-node="skills"]{ top:74%!important; }

  /* Círculos al extremo derecho */
  #synapses .synapse[data-node="experiencia"] .dot,
  #synapses .synapse[data-node="servicios"] .dot,
  #synapses .synapse[data-node="skills"] .dot{
    right:0!important;
    left:auto!important;
    top:6px!important;
  }

  /* Texto y numeración alineados en una misma columna */
  #synapses .synapse[data-node="experiencia"] .lbl,
  #synapses .synapse[data-node="servicios"] .lbl,
  #synapses .synapse[data-node="skills"] .lbl,
  #synapses .synapse[data-node="experiencia"] .num,
  #synapses .synapse[data-node="servicios"] .num,
  #synapses .synapse[data-node="skills"] .num{
    left:auto!important;
    text-align:right!important;
  }

  #synapses .synapse[data-node="servicios"] .lbl,
  #synapses .synapse[data-node="skills"] .lbl{
    right:96px!important;
    width:190px!important;
    color:#fff!important;
    text-shadow:0 0 14px rgba(0,0,0,.88),0 0 18px color-mix(in srgb,var(--c) 20%,transparent)!important;
  }
  #synapses .synapse[data-node="servicios"] .num,
  #synapses .synapse[data-node="skills"] .num{
    right:96px!important;
    width:190px!important;
  }

  #synapses .synapse[data-node="servicios"] .wire,
  #synapses .synapse[data-node="skills"] .wire{
    right:78px!important;
    left:auto!important;
    width:240px!important;
  }

  /* Experiencia: más grande pero controlada para no invadir */
  #synapses .synapse[data-node="experiencia"] .dot{
    width:90px!important;
    height:90px!important;
  }
  #synapses .synapse[data-node="experiencia"] .lbl{
    right:112px!important;
    width:205px!important;
    color:#fff!important;
    text-shadow:0 0 14px rgba(0,0,0,.88),0 0 18px rgba(255,180,84,.20)!important;
  }
  #synapses .synapse[data-node="experiencia"] .num{
    right:112px!important;
    width:205px!important;
    color:#ffd49a!important;
  }
  #synapses .synapse[data-node="experiencia"] .wire{
    right:90px!important;
    left:auto!important;
    width:250px!important;
  }
  #synapses .synapse[data-node="experiencia"]::after{
    right:112px!important;
    top:-16px!important;
  }

  /* Mantener consistencia visual */
  #synapses .synapse[data-node="servicios"] .wire::before,
  #synapses .synapse[data-node="skills"] .wire::before,
  #synapses .synapse[data-node="experiencia"] .wire::before{
    background:linear-gradient(270deg, var(--c), transparent)!important;
  }
  body.light-mode #synapses .synapse .lbl{
    color:#1d120c!important;
    text-shadow:none!important;
  }

  /* Móvil */
  @media(max-width:920px){
    #synapses .synapse[data-node="about"]{
      left:10px!important;
      top:15%!important;
      width:245px!important;
      transform:scale(.82)!important;
      transform-origin:left center!important;
    }
    #synapses .synapse[data-node="experiencia"]{
      right:8px!important;
      top:29%!important;
      width:280px!important;
      transform:scale(.78)!important;
      transform-origin:right center!important;
    }
    #synapses .synapse[data-node="servicios"]{
      right:8px!important;
      top:51%!important;
      width:270px!important;
      transform:scale(.80)!important;
      transform-origin:right center!important;
    }
    #synapses .synapse[data-node="skills"]{
      right:8px!important;
      top:73%!important;
      width:270px!important;
      transform:scale(.80)!important;
      transform-origin:right center!important;
    }
    #synapses .synapse[data-node="about"] .wire{ width:135px!important; }
    #synapses .synapse[data-node="servicios"] .wire,
    #synapses .synapse[data-node="skills"] .wire,
    #synapses .synapse[data-node="experiencia"] .wire{ width:150px!important; }

    #synapses .synapse[data-node="about"] .lbl,
    #synapses .synapse[data-node="about"] .num{
      left:78px!important; width:130px!important;
    }
    #synapses .synapse[data-node="servicios"] .lbl,
    #synapses .synapse[data-node="skills"] .lbl{
      right:88px!important; width:130px!important;
    }
    #synapses .synapse[data-node="servicios"] .num,
    #synapses .synapse[data-node="skills"] .num{
      right:88px!important; width:130px!important;
    }
    #synapses .synapse[data-node="experiencia"] .lbl,
    #synapses .synapse[data-node="experiencia"] .num{
      right:98px!important; width:135px!important;
    }
  }


  /* CAMBIO REAL: ocultar nodos derechos dinámicos viejos */
  #synapses .synapse[data-node="experiencia"],
  #synapses .synapse[data-node="servicios"],
  #synapses .synapse[data-node="skills"]{
    display:none!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }

  /* Columna derecha nueva, fija e independiente */
  #rightNodeColumn{
    position:fixed!important;
    right:3.2vw!important;
    top:22vh!important;
    bottom:13vh!important;
    width:380px!important;
    z-index:24!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:space-between!important;
    pointer-events:none!important;
  }

  #rightNodeColumn .rnode{
    position:relative!important;
    width:100%!important;
    height:112px!important;
    border:0!important;
    background:transparent!important;
    color:#fff!important;
    cursor:pointer!important;
    pointer-events:auto!important;
    padding:0!important;
    font-family:var(--fmono)!important;
    text-align:left!important;
  }

  #rightNodeColumn .rline{
    position:absolute!important;
    right:86px!important;
    top:56px!important;
    width:250px!important;
    height:2px!important;
    background:linear-gradient(270deg,var(--c),transparent)!important;
    box-shadow:0 0 14px color-mix(in srgb,var(--c) 45%,transparent)!important;
    overflow:hidden!important;
  }
  #rightNodeColumn .rline::after{
    content:''!important;
    position:absolute!important;
    top:-3px!important;
    bottom:-3px!important;
    width:34px!important;
    background:linear-gradient(90deg,transparent,#fff,var(--c),transparent)!important;
    filter:blur(.6px)!important;
    animation:rnodeWire 2.7s linear infinite!important;
  }

  #rightNodeColumn .rtxt{
    position:absolute!important;
    right:104px!important;
    top:36px!important;
    width:210px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-end!important;
    gap:7px!important;
    pointer-events:none!important;
  }
  #rightNodeColumn .rtxt small{
    color:var(--c)!important;
    font-size:10px!important;
    letter-spacing:.18em!important;
    text-transform:uppercase!important;
    text-shadow:0 0 12px color-mix(in srgb,var(--c) 55%,transparent)!important;
  }
  #rightNodeColumn .rtxt b{
    color:#fff!important;
    font-size:16px!important;
    letter-spacing:.16em!important;
    text-transform:uppercase!important;
    line-height:1!important;
    text-shadow:0 0 14px rgba(0,0,0,.9),0 0 20px color-mix(in srgb,var(--c) 26%,transparent)!important;
  }

  #rightNodeColumn .rcircle{
    position:absolute!important;
    right:0!important;
    top:9px!important;
    width:92px!important;
    height:92px!important;
    border-radius:50%!important;
    border:1.5px solid var(--c)!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    background:radial-gradient(circle, color-mix(in srgb,var(--c) 16%,rgba(8,4,22,.9)), rgba(8,4,22,.94))!important;
    box-shadow:
      0 0 32px color-mix(in srgb,var(--c) 48%,transparent),
      inset 0 0 18px color-mix(in srgb,var(--c) 28%,transparent)!important;
  }
  #rightNodeColumn .rcircle::before,
  #rightNodeColumn .rcircle::after{
    content:''!important;
    position:absolute!important;
    border-radius:50%!important;
    border:1px solid color-mix(in srgb,var(--c) 55%,transparent)!important;
    inset:-10px!important;
    opacity:.28!important;
    animation:rnodePulse 3.2s ease-in-out infinite!important;
  }
  #rightNodeColumn .rcircle::after{
    inset:-22px!important;
    opacity:.14!important;
    animation-duration:4.6s!important;
  }
  #rightNodeColumn .rglow{
    position:absolute!important;
    inset:-20px!important;
    border-radius:50%!important;
    background:radial-gradient(circle,color-mix(in srgb,var(--c) 20%,transparent),transparent 68%)!important;
    filter:blur(10px)!important;
    animation:rnodeBreath 3.4s ease-in-out infinite!important;
  }
  #rightNodeColumn .rspin{
    position:absolute!important;
    width:10px!important;
    height:10px!important;
    border-radius:50%!important;
    background:var(--c)!important;
    box-shadow:0 0 12px var(--c),0 0 24px var(--c)!important;
    animation:rnodeOrbit 4s linear infinite!important;
  }
  #rightNodeColumn svg{
    width:34px!important;
    height:34px!important;
    stroke:var(--c)!important;
    fill:none!important;
    stroke-width:1.7!important;
    z-index:2!important;
    filter:drop-shadow(0 0 10px var(--c))!important;
  }

  #rightNodeColumn .rnode-exp{
    transform:translateY(-8px)!important;
  }
  #rightNodeColumn .rnode-exp .rcircle{
    width:102px!important;
    height:102px!important;
    top:4px!important;
  }
  #rightNodeColumn .rnode-exp .rtxt{
    right:118px!important;
  }
  #rightNodeColumn .rnode-exp .rline{
    right:100px!important;
  }

  #rightNodeColumn .rnode:hover .rcircle{
    box-shadow:
      0 0 44px color-mix(in srgb,var(--c) 70%,transparent),
      inset 0 0 24px color-mix(in srgb,var(--c) 34%,transparent)!important;
  }
  #rightNodeColumn .rnode:hover{
    transform:translateX(-8px)!important;
  }
  #rightNodeColumn .rnode-exp:hover{
    transform:translate(-8px,-8px)!important;
  }

  body.panel-open #rightNodeColumn{
    opacity:.18!important;
    pointer-events:none!important;
  }

  body.light-mode #rightNodeColumn .rtxt b{
    color:#1d120c!important;
    text-shadow:none!important;
  }
  body.light-mode #rightNodeColumn .rcircle{
    background:rgba(255,250,247,.86)!important;
  }

  @keyframes rnodePulse{
    0%,100%{transform:scale(.94);opacity:.18}
    50%{transform:scale(1.08);opacity:.42}
  }
  @keyframes rnodeBreath{
    0%,100%{transform:scale(.96);opacity:.48}
    50%{transform:scale(1.08);opacity:.78}
  }
  @keyframes rnodeOrbit{
    0%{transform:rotate(0deg) translateX(48px) rotate(0deg)}
    100%{transform:rotate(360deg) translateX(48px) rotate(-360deg)}
  }
  @keyframes rnodeWire{
    0%{transform:translateX(-40px)}
    100%{transform:translateX(270px)}
  }

  @media(max-width:920px){
    #rightNodeColumn{
      right:10px!important;
      top:28vh!important;
      bottom:12vh!important;
      width:295px!important;
    }
    #rightNodeColumn .rnode{
      height:96px!important;
      transform:scale(.84)!important;
      transform-origin:right center!important;
    }
    #rightNodeColumn .rnode-exp{
      transform:translateY(-4px) scale(.80)!important;
    }
    #rightNodeColumn .rline{
      width:145px!important;
      right:78px!important;
    }
    #rightNodeColumn .rtxt{
      width:135px!important;
      right:92px!important;
    }
    #rightNodeColumn .rtxt b{
      font-size:12px!important;
    }
    #rightNodeColumn .rcircle{
      width:78px!important;
      height:78px!important;
    }
    #rightNodeColumn .rnode-exp .rcircle{
      width:86px!important;
      height:86px!important;
    }
    #rightNodeColumn .rnode-exp .rtxt{
      right:98px!important;
    }
    #rightNodeColumn .rnode-exp .rline{
      right:88px!important;
    }
  }


  /* HARD RESET de la derecha */
  #rightNodeColumn{
    position:fixed !important;
    right:3.4vw !important;
    top:18vh !important;
    bottom:14vh !important;
    width:360px !important;
    z-index:50 !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:space-between !important;
    align-items:stretch !important;
    pointer-events:none !important;
  }

  #rightNodeColumn .rnode{
    position:relative !important;
    display:block !important;
    width:100% !important;
    height:104px !important;
    margin:0 !important;
    border:0 !important;
    background:transparent !important;
    padding:0 !important;
    pointer-events:auto !important;
  }

  /* Orden visual limpio */
  #rightNodeColumn .rnode-exp{ order:1 !important; }
  #rightNodeColumn .rnode-serv{ order:2 !important; }
  #rightNodeColumn .rnode-skills{ order:3 !important; }

  #rightNodeColumn .rline{
    position:absolute !important;
    right:82px !important;
    top:52px !important;
    width:220px !important;
    height:2px !important;
  }

  #rightNodeColumn .rtxt{
    position:absolute !important;
    right:98px !important;
    top:34px !important;
    width:190px !important;
  }
  #rightNodeColumn .rtxt small{
    display:block !important;
    margin-bottom:6px !important;
  }
  #rightNodeColumn .rtxt b{
    display:block !important;
    font-size:15px !important;
  }

  #rightNodeColumn .rcircle{
    position:absolute !important;
    right:0 !important;
    top:7px !important;
    width:90px !important;
    height:90px !important;
  }

  #rightNodeColumn .rnode-exp .rcircle{
    width:98px !important;
    height:98px !important;
    top:3px !important;
  }
  #rightNodeColumn .rnode-exp .rline{ right:90px !important; width:228px !important; }
  #rightNodeColumn .rnode-exp .rtxt{ right:106px !important; width:198px !important; }

  /* ocultar por CSS todo nodo viejo de la derecha dentro de synapses */
  #synapses .synapse[data-node="experiencia"],
  #synapses .synapse[data-node="servicios"],
  #synapses .synapse[data-node="skills"]{
    display:none !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    width:0 !important;
    height:0 !important;
    overflow:hidden !important;
  }

  /* Mantener about a la izquierda si existe */
  #synapses .synapse[data-node="about"]{
    z-index:22 !important;
  }

  @media (max-width: 920px){
    #rightNodeColumn{
      right:10px !important;
      top:26vh !important;
      bottom:12vh !important;
      width:280px !important;
    }
    #rightNodeColumn .rnode{
      height:92px !important;
      transform:scale(.86) !important;
      transform-origin:right center !important;
    }
    #rightNodeColumn .rnode-exp{
      transform:scale(.82) !important;
    }
    #rightNodeColumn .rline{
      width:138px !important;
      right:78px !important;
    }
    #rightNodeColumn .rtxt{
      width:126px !important;
      right:90px !important;
    }
    #rightNodeColumn .rnode-exp .rline{
      width:145px !important;
      right:86px !important;
    }
    #rightNodeColumn .rnode-exp .rtxt{
      width:132px !important;
      right:96px !important;
    }
  }


  /* Métrica pequeña de visitas */
  .visit-metric{
    position:fixed;
    right:18px;
    bottom:18px;
    z-index:23;
    display:flex;
    align-items:center;
    gap:8px;
    padding:8px 11px;
    border:1px solid rgba(34,211,238,.34);
    background:rgba(8,4,22,.58);
    color:#ece8ff;
    font-family:var(--fmono);
    font-size:10px;
    letter-spacing:.11em;
    text-transform:uppercase;
    backdrop-filter:blur(12px);
    clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));
    box-shadow:0 12px 32px rgba(0,0,0,.26),0 0 18px rgba(34,211,238,.09);
    opacity:.86;
  }
  .visit-metric .vm-dot{
    width:7px;
    height:7px;
    border-radius:50%;
    background:#22d3ee;
    box-shadow:0 0 10px #22d3ee,0 0 22px rgba(34,211,238,.38);
    animation:visitDot 2.4s ease-in-out infinite;
  }
  .visit-metric .vm-label{
    color:rgba(236,232,255,.68);
  }
  .visit-metric strong{
    color:#22d3ee;
    font-size:12px;
    min-width:18px;
    text-align:right;
    text-shadow:0 0 10px rgba(34,211,238,.38);
  }
  body.panel-open .visit-metric,
  body.simple-mode .visit-metric{
    opacity:.24;
  }
  body.light-mode .visit-metric{
    background:rgba(255,250,247,.90)!important;
    border-color:rgba(217,31,38,.24)!important;
    color:#24130e!important;
    box-shadow:0 10px 26px rgba(217,31,38,.08)!important;
  }
  body.light-mode .visit-metric .vm-dot{
    background:#d91f26!important;
    box-shadow:0 0 10px rgba(217,31,38,.38)!important;
  }
  body.light-mode .visit-metric strong{
    color:#d91f26!important;
    text-shadow:none!important;
  }
  body.light-mode .visit-metric .vm-label{
    color:#7b5247!important;
  }
  @keyframes visitDot{
    0%,100%{transform:scale(.72);opacity:.58}
    50%{transform:scale(1.12);opacity:1}
  }
  @media(max-width:920px){
    .visit-metric{
      right:12px;
      bottom:68px;
      font-size:9px;
      padding:7px 9px;
    }
  }


  /* ===========================