/* Night City TCG · navegación pública unificada v1.1.05 */
.ph-nav-wrap{
  position:sticky;top:0;z-index:80;
  border-bottom:1px solid rgba(58,203,244,.18);
  background:rgba(4,8,13,.92);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  box-shadow:0 10px 40px rgba(0,0,0,.18)
}
.ph-nav{
  width:min(1720px,96vw);min-height:74px;margin:0 auto;
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:28px
}
.ph-brand{display:flex;align-items:center;text-decoration:none}
.ph-brand img{
  width:176px;height:auto;display:block;
  filter:drop-shadow(0 0 14px rgba(0,221,255,.18))
}
.ph-menu{display:flex;align-items:center;justify-content:center;gap:6px}
.ph-menu a{
  position:relative;display:inline-flex;align-items:center;gap:8px;
  padding:11px 12px;color:#cbd5e2;text-decoration:none;
  font-size:13px;font-weight:760;border-radius:8px;transition:.2s ease
}
.ph-menu a span{color:#8da5b9}
.ph-menu a:hover,.ph-menu a.active{color:#fff;background:#0b1520}
.ph-menu a:hover span,.ph-menu a.active span{color:#31d9d1}
.ph-menu a:after{
  content:"";position:absolute;left:12px;right:12px;bottom:3px;height:1px;
  background:#31d9d1;transform:scaleX(0);transition:.2s
}
.ph-menu a:hover:after,.ph-menu a.active:after{transform:scaleX(1)}
.ph-nav-actions{display:flex;align-items:center;gap:10px}
.ph-login,.ph-create{
  display:inline-flex;align-items:center;justify-content:center;text-decoration:none;
  border-radius:8px;padding:10px 16px;font-size:12px;font-weight:900;white-space:nowrap
}
.ph-login{color:#e4ecf6;border:1px solid #31465b;background:#08111a}
.ph-login:hover{border-color:#5f7d99;background:#0c1722}
.ph-create{
  color:#05070a;background:#f1ed16;border:1px solid #f1ed16;
  box-shadow:0 0 0 rgba(241,237,22,0);transition:.2s
}
.ph-create:hover{box-shadow:0 0 24px rgba(241,237,22,.22);transform:translateY(-1px)}

@media(min-width:1800px){.ph-nav{width:min(1780px,96vw)}}
@media(max-width:1180px){
  .ph-nav{grid-template-columns:auto 1fr auto;gap:14px}
  .ph-brand img{width:150px}
  .ph-menu{gap:0}
  .ph-menu a{padding:10px 8px;font-size:11px}
}
@media(max-width:900px){
  .ph-nav{grid-template-columns:auto 1fr}
  .ph-menu{display:none}
  .ph-nav-actions{justify-self:end}
}
@media(max-width:620px){
  .ph-nav{width:min(94vw,560px);min-height:66px;gap:10px}
  .ph-brand img{width:118px}
  .ph-nav-actions{gap:7px}
  .ph-login,.ph-create{min-height:40px;padding:9px 11px;font-size:11px}
}
@media(max-width:390px){
  .ph-nav{width:96vw;gap:7px}
  .ph-brand img{width:104px}
  .ph-nav-actions{gap:5px}
  .ph-login,.ph-create{padding:8px 9px;font-size:10px}
}
@media(prefers-reduced-motion:reduce){
  .ph-menu a:after,.ph-create{transition:none!important}
}


/* === v1.1.08 · misma cabecera dentro y fuera de la app === */
.ph-nav-admin{display:flex;align-items:center;justify-content:flex-end;gap:2px;min-width:0;white-space:nowrap}
.ph-nav-admin a{display:inline-flex;align-items:center;gap:5px;min-height:36px;padding:0 7px;color:#8797aa;text-decoration:none;font-size:10px;font-weight:650;border-radius:6px}
.ph-nav-admin a i{font-style:normal;color:#8fa2b7;font-size:10px}
.ph-nav-admin a:hover{color:#fff;background:#0d1722}
.ph-nav-admin small{padding-left:6px;color:#4f6073;font-size:8px}
.ph-nav-beta{margin-left:2px;padding:2px 5px;border:1px solid #8b860f;border-radius:999px;background:#1c1b05;color:#efe91c;font-size:7px;line-height:1;font-weight:950}

@media(min-width:1181px) and (max-width:1650px){
  .ph-nav{gap:14px}
  .ph-brand img{width:145px}
  .ph-menu{gap:1px}
  .ph-menu a{gap:5px;padding:10px 7px;font-size:10.5px}
  .ph-nav-admin a{padding:0 5px;font-size:9px;gap:4px}
  .ph-nav-admin small{font-size:7px;padding-left:3px}
}
@media(min-width:901px) and (max-width:1250px){
  .ph-nav-admin a span{display:none}
  .ph-nav-admin a{width:32px;justify-content:center;padding:0}
  .ph-nav-admin a i{font-size:13px}
  .ph-nav-admin small{display:none}
}
@media(max-width:900px){
  .ph-nav-admin{justify-self:end}
  .ph-nav-admin a span{display:none}
  .ph-nav-admin a{width:34px;justify-content:center;padding:0}
  .ph-nav-admin small{display:none}
}


/* === v1.1.12 · navegación móvil: logo + menú hamburguesa === */
.ph-menu-toggle{display:none}
.ph-nav-drawer{display:contents}

@media(max-width:900px){
  body.ph-mobile-nav-open{overflow:hidden}

  .global-public-nav .ph-nav{
    position:relative;
    width:min(94vw,720px);
    min-height:68px;
    grid-template-columns:minmax(0,1fr) auto;
    gap:10px;
  }

  .global-public-nav .ph-brand{min-width:0;justify-self:start}
  .global-public-nav .ph-brand img{width:148px;max-width:52vw}

  .global-public-nav .ph-menu-toggle{
    display:flex;width:44px;height:44px;padding:0;
    border:1px solid #2d4055;border-radius:9px;background:#08111a;
    align-items:center;justify-content:center;flex-direction:column;gap:5px;
    cursor:pointer;justify-self:end;
  }
  .global-public-nav .ph-menu-toggle span{
    display:block;width:20px;height:2px;border-radius:2px;background:#edf2f7;
    transition:transform .18s ease,opacity .18s ease;
  }
  .global-public-nav.menu-open .ph-menu-toggle{border-color:#f1ed16;background:#17190a}
  .global-public-nav.menu-open .ph-menu-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .global-public-nav.menu-open .ph-menu-toggle span:nth-child(2){opacity:0}
  .global-public-nav.menu-open .ph-menu-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  .global-public-nav .ph-nav-drawer{
    display:none;position:absolute;top:calc(100% + 1px);left:0;right:0;z-index:200;
    max-height:calc(100dvh - 82px);overflow:auto;padding:9px;
    border:1px solid #2b3b50;border-top-color:#223247;border-radius:0 0 12px 12px;
    background:linear-gradient(180deg,#09111a,#060b12);
    box-shadow:0 28px 80px rgba(0,0,0,.74);
  }
  .global-public-nav.menu-open .ph-nav-drawer{display:block}

  .global-public-nav .ph-menu{
    display:grid!important;grid-template-columns:1fr!important;gap:4px!important;
  }
  .global-public-nav .ph-menu a{
    width:100%;min-height:46px;padding:0 13px!important;
    display:flex;align-items:center;justify-content:flex-start;gap:11px!important;
    border-radius:8px;color:#aeb9c8;font-size:13px!important;
  }
  .global-public-nav .ph-menu a:after{display:none}
  .global-public-nav .ph-menu a>span{
    width:20px;display:inline-flex;justify-content:center;color:#58d9e3;
  }
  .global-public-nav .ph-menu a.active{
    background:#111a24;box-shadow:inset 3px 0 0 #f1ed16;color:#fff;
  }
  .global-public-nav .ph-nav-beta{margin-left:auto}

  .global-public-nav .ph-nav-admin{
    display:grid!important;grid-template-columns:1fr!important;justify-content:stretch!important;
    gap:2px!important;margin-top:8px;padding-top:8px;border-top:1px solid #1d2a39;
  }
  .global-public-nav .ph-nav-admin a{
    width:100%!important;min-height:42px!important;padding:0 13px!important;
    justify-content:flex-start!important;gap:10px!important;color:#91a1b4;font-size:12px!important;
  }
  .global-public-nav .ph-nav-admin a span{display:inline!important}
  .global-public-nav .ph-nav-admin a i{
    width:20px;display:inline-flex;justify-content:center;font-size:13px!important;
  }
  .global-public-nav .ph-nav-admin small{
    display:block!important;padding:8px 13px 4px!important;color:#53657a;font-size:9px!important;
  }

  .global-public-nav .ph-nav-actions{
    display:grid!important;grid-template-columns:1fr 1fr;gap:7px;
    margin-top:8px;padding-top:8px;border-top:1px solid #1d2a39;
  }
  .global-public-nav .ph-login,.global-public-nav .ph-create{
    min-height:42px;width:100%;
  }
}

@media(max-width:390px){
  .global-public-nav .ph-nav{width:94vw;min-height:64px}
  .global-public-nav .ph-brand img{width:132px}
  .global-public-nav .ph-menu-toggle{width:42px;height:42px}
}

@media(prefers-reduced-motion:reduce){
  .global-public-nav .ph-menu-toggle span{transition:none!important}
}