/* Nexo Desktop — GamePass ID V1
   Scope estricto: tarjeta autenticada del sidebar Desktop.
   No toca Mobile, timeline, News, Arrivals ni rail. */

.nxm-me{
  position:relative;
  padding:34px 13px 13px!important;
  overflow:visible!important;
  border:1px solid rgba(47,229,255,.58)!important;
  border-radius:16px!important;
  background:
    radial-gradient(210px 120px at 8% -4%,rgba(0,217,255,.18),transparent 68%),
    radial-gradient(180px 120px at 96% 8%,rgba(157,140,255,.14),transparent 68%),
    radial-gradient(260px 150px at 100% 100%,rgba(27,143,255,.11),transparent 72%),
    linear-gradient(168deg,rgba(10,46,63,.985),rgba(5,25,38,.995) 60%,rgba(3,18,29,.998))!important;
  box-shadow:
    0 20px 42px rgba(0,0,0,.28),
    0 0 28px rgba(0,217,255,.15),
    0 0 0 1px rgba(114,239,255,.12),
    inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.nxm-me::before{
  content:"GAMEPASS ID";
  position:absolute;left:13px;top:11px;
  color:#96f4ff;text-shadow:0 0 10px rgba(0,217,255,.26);
  font:800 8px/1 "Barlow Condensed",sans-serif;
  letter-spacing:.19em;
}
.nxm-me::after{
  content:"●  IDENTIDAD NEXO";
  position:absolute;left:84px;top:11px;
  padding-left:8px;
  border-left:0;
  color:#8ba6b4;
  font:700 7.6px/1 "Barlow Condensed",sans-serif;
  letter-spacing:.13em;
}

.nxm-me-top{align-items:center!important;gap:10px!important}
.nxm-me-avatar{position:relative}
.nxm-me-top .nxm-avatar{
  width:50px!important;height:50px!important;
  border:1px solid rgba(126,243,255,.70)!important;
  box-shadow:0 0 0 3px rgba(0,217,255,.12),0 0 18px rgba(0,217,255,.22),0 7px 16px rgba(0,0,0,.28);
}
.nx-gpid-nick{
  display:block;
  color:#f4fbff;
  text-decoration:none;
  font:800 14px/1.05 Barlow,sans-serif;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.nx-gpid-nick:hover,.nx-gpid-nick:focus-visible{color:#8becff}
.nxm-me-copy>span{
  margin-top:5px!important;
  color:#839cac!important;
  font:700 8.6px/1 "Barlow Condensed",sans-serif!important;
  letter-spacing:.065em;
  text-transform:uppercase;
}
.nxm-me-actions{gap:3px!important}
.nxm-me-actions button{
  width:32px!important;height:32px!important;
  border-radius:9px!important;
  color:#b3c7d1!important;
  border:1px solid rgba(77,216,241,.14)!important;
  background:rgba(4,24,34,.36)!important;
  transition:color .16s ease,background .16s ease,transform .16s ease!important;
}
.nxm-me-actions button:hover,.nxm-me-actions button:focus-visible{
  color:#f7feff!important;
  background:rgba(0,217,255,.16)!important;
  outline:1px solid rgba(0,217,255,.42)!important;
  box-shadow:0 0 16px rgba(0,217,255,.16)!important;
}
.nxm-me-actions button:active{transform:scale(.94)}
.nxm-me-actions svg{width:16px!important;height:16px!important;fill:currentColor!important;stroke:none!important}

.nx-gpid-progress-card{
  margin-top:12px;
  padding:10px 10px 9px;
  border:1px solid rgba(36,210,241,.20);
  border-radius:11px;
  background:
    radial-gradient(150px 70px at 18% 0%,rgba(0,217,255,.075),transparent 72%),
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
.nx-gpid-progress-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:7px}
.nx-gpid-progress-head span{color:#a8d8e3;font:800 7.2px/1 "Barlow Condensed",sans-serif;letter-spacing:.16em}
.nx-gpid-progress-head b{color:#e9fdff;font:800 9px/1 Barlow,sans-serif;text-shadow:0 0 9px rgba(0,217,255,.22)}
.nxm-me-rank{
  margin-top:0!important;
  gap:7px!important;
  color:var(--gpid-rank,#9d8cf9)!important;
}
.nxm-me-rank i{
  width:3px!important;height:12px!important;
  background:var(--gpid-rank,#9d8cf9)!important;
  box-shadow:0 0 10px color-mix(in srgb,var(--gpid-rank,#9d8cf9) 60%,transparent)!important;
}
.nxm-me-rank span{
  color:var(--gpid-rank,#9d8cf9);
  font:800 9.5px/1 "Barlow Condensed",sans-serif;
  letter-spacing:.15em;
}
.nxm-me-rank [data-gpid-level]{
  color:#8298a8!important;
  letter-spacing:.09em!important;
}
.nxm-me-progress{
  height:8px!important;
  margin-top:7px!important;
  border-radius:999px!important;
  background:rgba(0,12,19,.75)!important;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.55),0 0 0 1px rgba(87,226,248,.06);
}
.nxm-me-progress span{
  position:relative;
  min-width:3px;
  border-radius:999px!important;
  box-shadow:0 0 16px color-mix(in srgb,var(--gpid-rank,#9d8cf9) 54%,transparent),0 0 8px rgba(0,217,255,.12);
  transition:width .5s cubic-bezier(.2,.8,.2,1),background .25s ease;
}
.nxm-me-progress span::after{
  content:"";
  position:absolute;right:-1px;top:50%;width:7px;height:7px;margin-top:-3.5px;border-radius:50%;
  background:currentColor;
  box-shadow:0 0 9px currentColor;
  opacity:.82;
}

/* Insignia: una sola identidad, no una card dentro de otra card. */
.nxm-me-badge.nx-gpid-badge{
  width:100%;
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr) 12px;
  align-items:center;
  gap:9px!important;
  min-height:54px;
  margin-top:11px!important;
  padding:6px 8px!important;
  border-radius:10px!important;
  border:1px solid rgba(174,148,255,.22)!important;
  background:
    radial-gradient(120px 70px at 12% 20%,rgba(157,140,255,.10),transparent 72%),
    linear-gradient(90deg,rgba(90,60,170,.14),rgba(0,217,255,.025))!important;
  text-align:left;
  cursor:pointer;
  appearance:none;
  transition:border-color .16s ease,background .16s ease,transform .16s ease!important;
}
.nxm-me-badge.nx-gpid-badge:hover,.nxm-me-badge.nx-gpid-badge:focus-visible{
  border-color:rgba(190,166,255,.40)!important;
  background:linear-gradient(90deg,rgba(157,140,255,.16),rgba(0,217,255,.055))!important;
  box-shadow:0 0 16px rgba(157,140,255,.08)!important;
  outline:none;
}
.nxm-me-badge.nx-gpid-badge:active{transform:scale(.985)}
.nx-gpid-badge-medal{
  width:40px;height:40px;border-radius:50%;
  display:grid;place-items:center;
  overflow:hidden;
  border:1px solid rgba(190,168,255,.36);
  background:radial-gradient(circle at 35% 25%,rgba(203,191,255,.18),rgba(120,94,210,.09) 58%,rgba(0,217,255,.04));
  box-shadow:0 0 14px rgba(157,140,255,.12),0 7px 14px rgba(0,0,0,.22);
  
}
.nx-gpid-badge-medal img{width:100%!important;height:100%!important;border-radius:50%!important;object-fit:cover!important}
.nx-gpid-badge-medal svg{width:18px;height:18px;fill:none;stroke:#587180;stroke-width:1.6}
.nx-gpid-badge-copy{min-width:0}
.nx-gpid-badge-copy b{
  display:block!important;
  color:#e5f0f4!important;
  font:750 10.5px/1.15 Barlow,sans-serif!important;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.nx-gpid-badge-copy small{
  display:block!important;
  margin-top:3px!important;
  color:#b6a8ff!important;
  font:800 7px/1 "Barlow Condensed",sans-serif!important;
  letter-spacing:.13em!important;
}
.nx-gpid-chevron{color:#4e6877;font:800 15px/1 Barlow,sans-serif}

/* Pulso: rayos canónicos, no barras de batería. */
.nxm-me-pulso{
  margin-top:10px!important;
  padding:9px 10px!important;
  gap:8px!important;
  border:1px solid rgba(0,217,255,.22)!important;
  border-radius:10px;
  background:
    radial-gradient(130px 65px at 50% 0%,rgba(0,217,255,.12),transparent 75%),
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}
.nxm-me-pulso>span:first-child{
  color:#75efff!important;text-shadow:0 0 8px rgba(0,217,255,.24);
  font:800 8px/1 "Barlow Condensed",sans-serif!important;
  letter-spacing:.15em!important;
}
.nxm-me-pulso [data-pips]{
  justify-content:center;
  gap:3px!important;
}
.nxm-me-pulso [data-pips] i{
  flex:0 0 13px!important;
  width:13px!important;height:14px!important;
  border-radius:0!important;
  clip-path:polygon(54% 0,12% 56%,43% 56%,34% 100%,88% 39%,57% 39%);
  background:rgba(255,255,255,.095)!important;
  transition:background .18s ease,filter .18s ease,transform .18s ease,opacity .18s ease;
}
.nxm-me-pulso [data-pips] i.is-on{
  background:var(--gpid-pulse,#00d9ff)!important;
  box-shadow:none!important;
  filter:drop-shadow(0 0 6px rgba(0,217,255,.72));
}
.nxm-me-pulso [data-cnt]{
  color:var(--gpid-pulse,#00d9ff)!important;
  font:800 9px/1 Barlow,sans-serif!important;
}
.nxm-me-links{
  display:grid!important;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:10px!important;
}
.nxm-me-links a{
  min-height:36px;
  display:flex!important;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(0,217,255,.25);
  border-radius:10px;
  background:linear-gradient(180deg,rgba(0,217,255,.07),rgba(0,217,255,.025));
  color:#dffaff!important;
  text-decoration:none!important;
  font:800 9px/1 Barlow,sans-serif!important;
  transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease;
}
.nxm-me-links a:hover,.nxm-me-links a:focus-visible{
  border-color:rgba(0,217,255,.48);
  background:rgba(0,217,255,.13);
  box-shadow:0 0 16px rgba(0,217,255,.10);
  outline:none;
}
.nxm-me-links a:active{transform:scale(.985)}

/* Única señal contextual. Sólo existe si hay algo que merece atención. */
.nx-gpid-signal{
  display:none;
  margin-top:9px;
  padding:7px 8px 7px 10px;
  border-left:2px solid var(--gpid-signal,#00d9ff);
  border-radius:0 8px 8px 0;
  background:linear-gradient(90deg,rgba(0,217,255,.055),transparent);
}
.nx-gpid-signal.is-visible{display:block}
.nx-gpid-signal strong{
  display:block;color:var(--gpid-signal,#00d9ff)!important;
  font:800 7.5px/1 "Barlow Condensed",sans-serif!important;
  letter-spacing:.15em;
}
.nx-gpid-signal span{
  display:block;margin-top:3px;
  color:#94aab7;
  font:600 9.5px/1.3 Barlow,sans-serif;
}

/* Picker / preview se inyectan a body para no sufrir clipping del sidebar. */
.nx-gpid-pop{
  position:fixed;z-index:950;
  border:1px solid rgba(0,217,255,.36);
  background:linear-gradient(165deg,rgba(10,38,52,.995),rgba(4,18,28,.998));
  box-shadow:0 28px 66px -18px #000,0 0 28px rgba(0,217,255,.08),0 0 0 1px rgba(0,0,0,.5);
  backdrop-filter:blur(16px);
}
.nx-gpid-preview{
  width:272px;padding:16px;border-radius:15px;
  pointer-events:none;
}
.nx-gpid-preview-art{
  width:126px;height:126px;margin:0 auto 13px;border-radius:50%;
  display:grid;place-items:center;overflow:hidden;
  border:1px solid rgba(0,217,255,.30);
  background:radial-gradient(circle,rgba(0,217,255,.11),rgba(0,0,0,.2));
  box-shadow:0 12px 28px rgba(0,0,0,.4),0 0 26px rgba(0,217,255,.07);
}
.nx-gpid-preview-art img{width:100%;height:100%;object-fit:cover}
.nx-gpid-preview-art svg{width:38px;height:38px;fill:none;stroke:#4f6877;stroke-width:1.5}
.nx-gpid-preview-kicker{
  color:#5ce1f5;text-align:center;
  font:800 8px/1 "Barlow Condensed",sans-serif;letter-spacing:.17em;
}
.nx-gpid-preview h3{
  margin:7px 0 0;text-align:center;color:#f4fbff;
  font:800 17px/1.05 Barlow,sans-serif;
}
.nx-gpid-preview p{
  margin:9px 0 0;color:#9db0bb;text-align:center;
  font:500 11px/1.48 Inter,sans-serif;
}

.nx-gpid-picker{
  width:286px;max-height:min(480px,calc(100vh - 28px));
  border-radius:15px;overflow:hidden;
}
.nx-gpid-picker-head{
  display:flex;align-items:center;gap:8px;padding:12px 13px;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.nx-gpid-picker-head strong{color:#f1f8fb;font:800 11px/1 Barlow,sans-serif}
.nx-gpid-picker-head small{color:#627989;font:700 8px/1 "Barlow Condensed";letter-spacing:.11em}
.nx-gpid-picker-close{
  margin-left:auto;width:30px;height:30px;border:0;border-radius:8px;background:transparent;
  color:#7f95a3;font:700 18px/1 Inter;cursor:pointer;
}
.nx-gpid-picker-close:hover,.nx-gpid-picker-close:focus-visible{background:rgba(255,255,255,.06);color:#fff;outline:none}
.nx-gpid-picker-list{max-height:390px;overflow:auto;padding:6px}
.nx-gpid-option{
  width:100%;display:grid;grid-template-columns:40px minmax(0,1fr) 18px;align-items:center;gap:9px;
  padding:7px 8px;border:0;border-radius:9px;background:transparent;color:inherit;text-align:left;cursor:pointer;
}
.nx-gpid-option:hover,.nx-gpid-option:focus-visible{background:rgba(0,217,255,.065);outline:none}
.nx-gpid-option.is-active{background:rgba(0,217,255,.09)}
.nx-gpid-option-art{
  width:38px;height:38px;border-radius:50%;overflow:hidden;display:grid;place-items:center;
  border:1px solid rgba(0,217,255,.19);background:rgba(0,217,255,.04);
}
.nx-gpid-option-art img{width:100%;height:100%;object-fit:cover}
.nx-gpid-option-copy{min-width:0}
.nx-gpid-option-copy b{display:block;color:#e7f0f4;font:700 10.5px/1.1 Barlow,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nx-gpid-option-copy small{display:block;margin-top:3px;color:#718897;font:500 8.5px/1.25 Inter,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nx-gpid-option-check{color:#00d9ff;font:800 14px/1 Barlow}
.nx-gpid-option--none .nx-gpid-option-art{border-style:dashed;color:#526877;font:800 16px Barlow}

/* Popovers existentes: targets y lectura algo mejores sin rediseñarlos. */
.nxm-popover{border-color:rgba(0,217,255,.22)!important}
.nxm-menu a{min-height:34px;display:flex!important;align-items:center}
.nxm-popover-foot{min-height:34px;display:flex!important;align-items:center;justify-content:center}

@media(max-width:1320px){
  .nxm-me{padding-left:11px!important;padding-right:11px!important}
  .nxm-me-actions button{width:30px!important;height:30px!important}
  .nxm-me-pulso [data-pips] i{flex-basis:12px!important;width:12px!important}
}
@media(prefers-reduced-motion:reduce){
  .nxm-me-actions button,.nxm-me-badge.nx-gpid-badge,.nxm-me-progress span,.nxm-me-pulso [data-pips] i{transition:none!important}
}