/* Perfil TORNEOS JS: disposición inspirada en redes sociales, navegación en 3 pestañas.
   Solo se aplica a usuarios con sesión, en la pestaña Perfil. */
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking){
 background:#090b11;
 color:#f5f7fb;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) .wrap{
 width:100%;
 max-width:810px;
 padding:0 0 105px;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) header{
 padding:10px 18px 12px;
 margin:0;
 background:#090b11;
 border-bottom:1px solid #252b3a;
 min-height:64px;
 display:flex;
 align-items:center;
 justify-content:space-between;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) header .brand .logo,
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) header .brand small{
 display:none!important;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) header .brand b{
 color:#fff;
 font-size:18px;
 font-weight:900;
 line-height:1.25;
 letter-spacing:0;
 max-width:calc(100vw - 160px);
 overflow:hidden;
 text-overflow:ellipsis;
 white-space:nowrap;
 display:block;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) header .brand{min-width:0}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) header .refresh{display:none!important}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) header .js-bell{
 border:0;
 background:none;
 width:42px;height:42px;
 font-size:22px;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-account-view{
 display:block;
 width:100%;
 max-width:810px;
 padding:0;
 margin:0 auto;
 background:transparent;
 border:0;
 border-radius:0;
 box-shadow:none;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-account-view>.js-web-profile-heading,
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-account-view>.js-web-profile-description{
 display:none!important;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-account-signed{
 display:block;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-web-profile{
 margin:0;
 border:0;
 border-radius:0;
 overflow:visible;
 background:transparent;
 box-shadow:none;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-web-cover{
 height:clamp(172px,27vw,240px);
 border-radius:0;
 background-position:center center;
 background-color:#151c2c;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-web-avatar{
 width:108px;
 height:108px;
 margin:-53px 20px 0 auto;
 border:5px solid #090b11;
 box-shadow:0 5px 18px #000a;
 border-radius:50%;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) .js-web-profile-details{
 padding:6px 20px 19px;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-web-display-name{
 font-size:26px;
 line-height:1.2;
 color:#fff;
 letter-spacing:-.5px;
 font-weight:950;
 margin:0 0 3px;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-web-user-handle{
 font-size:13px;
 color:#a9b0bf;
 font-weight:650;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-web-admin-badge{margin-top:7px}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) .js-web-profile-admin{
 margin:0;
 border-radius:6px;
 font-size:11px;
 padding:5px 8px;
 background:#4d3820;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-web-profile-stats{
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:0;
 border-top:1px solid #222938;
 border-bottom:1px solid #222938;
 margin:17px 0;
 padding:12px 0;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) .js-web-profile-stat{
 background:transparent;
 border:0;
 border-radius:0;
 padding:3px 5px;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) .js-web-profile-stat:not(:last-child){
 border-right:1px solid #283042;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) .js-web-profile-stat strong{
 color:#fff;
 font-size:22px;
 font-weight:900;
 line-height:1.4;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) .js-web-profile-stat small{
 color:#a8b1c0;
 font-size:11px;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-web-user-bio{
 color:#e8e8f0;
 font-size:13px;
 margin:14px 0 8px;
 line-height:1.55;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-web-freefire{
 font-size:11px;
 color:#acdccb;
 line-height:1.65;
 margin:7px 0 12px;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-web-profile .account-row{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:9px;
 margin-top:18px!important;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-web-profile .account-row>.btn-alt{
 background:#202634;
 color:#f2f4f9;
 border:1px solid #40485b;
 border-radius:9px;
 font-weight:800;
 padding:10px 7px;
 min-height:42px;
 font-size:12px;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-account-signed>.account-card{
 margin:16px 16px 0;
 background:#111724;
 border:1px solid #2b3444;
 border-radius:13px;
 padding:16px;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-google-name{font-size:13px}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-google-logout{font-size:12px}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) nav{
 background:#090b11;
 border-top:1px solid #252a38;
 box-shadow:0 -9px 21px #0005;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) nav .player-nav-button{
 min-width:0;
 flex:1;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) nav .player-nav-button.is-current{
 color:#ff7898;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-web-editor{
 background:#111824;
 border:1px solid #354357;
}
@media(min-width:640px){
 body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-web-cover{border-radius:0 0 14px 14px}
}
@media(max-width:370px){
 body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) .js-web-profile-details{padding-left:15px;padding-right:15px}
 body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-web-profile .account-row>.btn-alt{font-size:11px}
}

/* El encabezado está dentro de .wrap, pero el perfil va fuera de él.
   Quitar el padding inferior de .wrap elimina la franja vacía entre ambos. */
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) .wrap{
  padding-bottom:0;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-account-view{
  margin-top:0;
}


/* PROFUNDIDAD FINAL DE PERFIL (móvil y escritorio)
   La navegación es fija. Reservar su altura por debajo del contenido
   evita que tape el último campo e impida llegar al marco de cierre. */
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-account-view {
  height:auto;
  max-height:none;
  overflow:visible;
  padding-bottom:calc(126px + env(safe-area-inset-bottom, 0px));
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-account-signed>.account-card {
  margin:20px 16px 0;
  padding:19px 17px 24px;
  border-radius:17px;
  border:1px solid #4b536b;
  box-shadow:0 10px 32px #0005, inset 0 1px #ffffff09;
  background:linear-gradient(160deg,#172134,#0e1422);
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) .js-profile-end {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  margin:24px 22px 0;
  padding:10px 0 6px;
}
.js-profile-end-line {
  flex:1;
  max-width:155px;
  height:1px;
  background:linear-gradient(90deg,transparent,#814256,transparent);
}
.js-profile-end-text {
  color:#a1aabe;
  font-size:10px;
  font-weight:800;
  white-space:nowrap;
  letter-spacing:1.2px;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) {
  overflow-y:visible;
  overscroll-behavior-y:auto;
}
@media(max-width:380px){
  body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-account-signed>.account-card{
    margin-left:12px;margin-right:12px;padding-left:13px;padding-right:13px;
  }
  .js-profile-end{gap:6px!important}
}


/* BANNER DESDE ARRIBA — PERFIL
   El encabezado vive dentro de .wrap, mientras el perfil está debajo de
   ese contenedor. Se saca el header del flujo SOLO en Perfil: la portada
   arranca en el borde superior y el botón de avisos flota sobre ella. */
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) .wrap{
  position:relative;
  min-height:0;
  height:0;
  padding:0;
  margin:0 auto;
  overflow:visible;
  z-index:3;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) .wrap > header{
  position:absolute;
  inset:0 0 auto 0;
  height:0;
  min-height:0;
  width:100%;
  padding:0;
  margin:0;
  border:0;
  background:transparent;
  z-index:12;
  pointer-events:none;
  overflow:visible;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) header .brand{
  display:none!important;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) header .js-header-actions{
  position:absolute;
  top:14px;
  right:17px;
  pointer-events:auto;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) header .js-bell{
  width:46px;
  height:46px;
  border-radius:50%;
  background:#0a1329b8;
  border:1px solid #e4eaf87d;
  color:#fff;
  box-shadow:0 4px 14px #0008;
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-web-cover{
  height:clamp(205px,54vw,300px);
  background-size:cover;
  background-position:center center;
}
body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) #js-web-avatar{
  margin-top:-53px;
}
@media(min-width:810px){
  body.js-profile-tab:not(.js-auth-required):not(.js-auth-checking) .wrap > header{
    left:0;
  }
}