.menu-panel{
    position:fixed;
    top:0;
    left:0;
    height:100vh;
    height:100dvh;
    width:280px;
    max-width:82vw;
    background:linear-gradient(180deg,#153627 0%, #0F2A20 100%);
    border-right:1px solid rgba(216,226,75,.15);
    box-shadow:24px 0 48px var(--sombra);
    transform:translate3d(-100%,0,0);
    -webkit-transform:translate3d(-100%,0,0);
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
    transition:transform .45s cubic-bezier(.65,0,.35,1);
    z-index:40;
    display:flex;
    flex-direction:column;
    will-change:transform;
}
.menu-panel.abierto{
    transform:translate3d(0,0,0);
    -webkit-transform:translate3d(0,0,0);
}

.menu-header{
    padding:28px 26px 20px;
    border-bottom:2px solid rgba(77,216,226,.6);
    box-shadow:0 1px 16px -2px rgba(77,216,226,.5);
}
.menu-header .eyebrow{
    font-family:'Oswald',sans-serif;
    font-size:20px;
    letter-spacing:.16em;
    text-transform:uppercase;
    color:var(--amarillo-bola);
    margin:0 0 4px;
}
.menu-header .nombre-club{
    font-family:'Inter',system-ui,sans-serif;
    font-weight:500;
    font-size:14px;
    margin:0;
    letter-spacing:.06em;
    font-variant-numeric:tabular-nums;
}

.menu-lista{
    list-style:none;
    margin:0;
    padding:14px 0;
    flex:1;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
}
.menu-lista li{margin:0;}

.menu-item{
    display:flex;
    align-items:center;
    gap:14px;
    width:100%;
    padding:14px 26px;
    background:none;
    border:none;
    border-left:3px solid transparent;
    color:var(--tiza);
    font-family:'Oswald',sans-serif;
    font-weight:500;
    font-size:16px;
    letter-spacing:.02em;
    text-align:left;
    text-decoration:none;
    cursor:pointer;
    transition:background-color .15s ease, border-color .15s ease, padding-left .15s ease;
}
.menu-item:hover,
.menu-item:focus-visible{
    background:rgba(216,226,75,.08);
    border-left-color:var(--amarillo-bola);
    padding-left:30px;
}
.menu-item:focus-visible{
    outline:2px solid var(--amarillo-bola);
    outline-offset:-2px;
}
.menu-item.admin{
    color:var(--amarillo-bola);
}
.menu-item.salir{
    color:#ffb3b3;
    border-top:1px solid rgba(255,255,255,.08);
    margin-top:8px;
}

.menu-footer{
    padding:16px 26px 22px;
    border-top:1px solid rgba(255,255,255,.08);
    font-size:12px;
    color:var(--gris-texto);
}

.menu-toggle{
    position:fixed;
    top:50%;
    left:0;
    transform:translate3d(0,-50%,0);
    -webkit-transform:translate3d(0,-50%,0);
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
    width:30px;
    height:64px;
    background:var(--verde-pista-2);
    border:1px solid rgba(216,226,75,.25);
    border-left:none;
    border-radius:0 8px 8px 0;
    color:var(--amarillo-bola);
    font-family:'Oswald',sans-serif;
    font-size:15px;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    z-index:41;
    transition:transform .45s cubic-bezier(.65,0,.35,1), background-color .15s ease;
     will-change:transform;
}
.menu-toggle:hover{background:#26594570;}
.menu-toggle:focus-visible{
    outline:2px solid var(--amarillo-bola);
    outline-offset:2px;
}
.menu-toggle.abierto{
    transform:translate3d(280px,-50%,0);
    -webkit-transform:translate3d(280px,-50%,0);
}
@media (max-width:360px){
    .menu-toggle.abierto{
        transform:translate3d(82vw,-50%,0);
        -webkit-transform:translate3d(82vw,-50%,0);
    }
}

.menu-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.4);
    opacity:0;
    pointer-events:none;
    transition:opacity .3s ease;
    z-index:39;
}
.menu-overlay.visible{
    opacity:1;
    pointer-events:auto;
}

@media (prefers-reduced-motion:reduce){
    .menu-panel,.menu-toggle,.menu-overlay{transition:none;}
}

.banner-identidad{
  position:fixed;
  top:14px;
  right:66px;   /* 16px (margen de la campana) + 40px (ancho campana) + 10px (separaci¨®n) */
  z-index:50;
  height:40px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:0 14px;
  background:rgba(0,0,0,.35);
  border:1px solid rgba(216,226,75,.3);
  border-radius:20px;
  font-family:'Inter',sans-serif;
  font-size:13px;
  color:var(--tiza);
  white-space:nowrap;
  max-width:calc(100vw - 130px); /* deja hueco a la izquierda para el bot¨®n de men¨² */
  overflow:hidden;
  text-overflow:ellipsis;
}
.banner-identidad b{
  color:#D8E24B;
}
.banner-identidad-sim{
  color:#ffb3b3;
}
@media (max-width:480px){
  .banner-identidad{
    font-size:11px;
    padding:0 10px;
    gap:5px;
  }
  .banner-identidad-sim{
    display:none;
  }
}