.collective-technical{width:min(1080px,calc(100vw - 24px));max-height:calc(100dvh - 24px);box-sizing:border-box;overflow:auto;background:#0b202b;color:#eef6fa;border:1px solid #47616d;border-radius:18px;padding:24px}
.collective-technical::backdrop{background:#000b}
.team-measurements nav{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}
.team-measurements [hidden]{display:none!important}
.team-measurements nav [aria-pressed="true"]{background:#195345;border-color:#75dfc5}
.team-measurements-scroll{overflow-x:auto;max-width:100%}
.team-measurements table{width:100%;border-collapse:collapse;text-align:left}
.team-measurements th,.team-measurements td{padding:12px;border-bottom:1px solid #47616d;vertical-align:middle}
.team-measurements caption{text-align:left;font-weight:700;padding:12px 0}
.team-measurements td input{width:120px}
.team-measurements td input[type=checkbox]{width:24px;height:24px;min-height:24px;accent-color:#75dfc5}
.team-measurements [data-physical]>footer{position:sticky;bottom:-24px;background:#0b202b;padding:12px 0;border-top:1px solid #47616d;z-index:1}
.team-measurements-feedback{flex-basis:100%;margin:0;overflow-wrap:anywhere}
.team-measurements[data-measurement-mode=ranking] [data-physical]>footer{position:static}
@media(max-width:650px){.team-measurements header{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:8px}.team-measurements h2{font-size:22px;margin:10px 0}.team-measurements nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0}.team-measurements nav button{font-size:14px;min-width:0;padding:8px}.team-measurements p,.team-measurements th,.team-measurements td,.team-measurements footer{font-size:14px;line-height:1.45}.team-measurements th,.team-measurements td{padding:8px}.team-measurements .collective-filters{gap:10px;margin:12px 0}}
.team-measurements [data-technical]>.collective-technical{width:100%;max-height:none;border:0;padding:0;overflow:visible}
.collective-technical header,.collective-technical footer{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.collective-technical button,.collective-technical select,.collective-technical input{font:inherit;min-height:46px;max-width:100%;box-sizing:border-box;padding:10px;border:1px solid #527280;border-radius:9px;background:#102b39;color:#eef6fa}
.collective-technical button:disabled{opacity:.5}
.collective-filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0}
.collective-filters label,.collective-block{display:grid;gap:8px;min-width:0}
.collective-player{display:grid;grid-template-columns:minmax(160px,1fr) auto;gap:12px;border-block-end:1px solid #47616d;padding:18px 0}
.collective-player strong,.collective-player span{display:block;overflow-wrap:anywhere}
.collective-actions{display:flex;gap:8px;flex-wrap:wrap;grid-column:1/-1}
.collective-attempts{grid-column:1/-1;color:#b9cedd}
.collective-technical footer{margin-top:20px}
@media(max-width:650px){.collective-technical{padding:16px}.collective-filters{grid-template-columns:1fr}.collective-player{grid-template-columns:minmax(0,1fr) auto}.collective-actions button{flex:1 1 42%}.collective-technical footer button{width:100%}}
.fisico-historial { display:grid; gap:12px; }
.fisico-historial article, .fisico-resumen { padding:12px; border:1px solid #d5dce5; border-radius:12px; }
.fisico-historial p, .fisico-resumen p { overflow-wrap:anywhere; }
/* ===========================
   ESTILO GLOBAL
=========================== */

html {
  height: 100%;
  background: url("assets/img/fondo_pista.jpg") center/cover no-repeat;
  background-color: #061119;
}

body {
  margin: 0;
  height: 100%;
  overflow: hidden; /* quitamos el scroll general */
  font-family: Arial, sans-serif;
  background: #061119 !important;
  color: #fff;
}

/* ===========================
   SIDEBAR — UX PRO FINAL
=========================== */

#sidebar {
  position: fixed;
  top: 0;
  left: 0;
  width: 250px;
  height: 100vh;
  background: linear-gradient(180deg, #0d0d0d, #161616);
  border-right: 1px solid rgba(255, 255, 255, 0.12);
  padding: 28px 22px;
  display: flex;
  flex-direction: column;
  gap: 22px;
  box-shadow: 6px 0 22px rgba(0, 0, 0, 0.55);
  z-index: 10;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(55, 230, 161, 0.28) transparent;
  opacity: 0;
  transform: translateX(-12px);
  transition:
    opacity 0.35s ease,
    transform 0.35s ease;
}

#sidebar::-webkit-scrollbar {
  width: 10px;
}

#sidebar::-webkit-scrollbar-track {
  background: transparent;
}

#sidebar::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background: rgba(55, 230, 161, 0.26);
  background-clip: content-box;
}

#sidebar.sidebar-ready {
  opacity: 1;
  transform: translateX(0);
}

#sidebarEstadoApp {
  padding: 9px 12px;
  border: 1px solid rgba(55, 230, 161, 0.18);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(55, 230, 161, 0.12), rgba(3, 14, 21, 0.7));
  color: var(--color-primary);
  font-size: 12px;
  font-weight: 750;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.sidebar-instalar-app {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  margin-top: -10px;
  padding: 0 14px;
  border: 1px solid rgba(83, 200, 255, 0.26);
  border-radius: 11px;
  background: linear-gradient(135deg, rgba(83, 200, 255, 0.16), rgba(55, 230, 161, 0.12));
  color: #dff9ff;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.02em;
  cursor: pointer;
  box-shadow:
    0 10px 24px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
  transition:
    transform 0.2s ease,
    border-color 0.2s ease,
    background 0.2s ease,
    box-shadow 0.2s ease;
}

.sidebar-instalar-app:hover {
  transform: translateY(-1px);
  border-color: rgba(83, 200, 255, 0.48);
  background: linear-gradient(135deg, rgba(83, 200, 255, 0.22), rgba(55, 230, 161, 0.16));
  box-shadow:
    0 14px 28px rgba(0, 0, 0, 0.28),
    0 0 0 1px rgba(83, 200, 255, 0.06) inset;
}

.sidebar-instalar-hint {
  padding: 10px 12px;
  border: 1px dashed rgba(83, 200, 255, 0.18);
  border-radius: 12px;
  background: rgba(6, 17, 25, 0.56);
  color: rgba(236, 247, 251, 0.76);
  font-size: 12px;
  line-height: 1.45;
}

.sidebar-usuario {
  display: grid;
  gap: 10px;
  padding: 14px 12px;
  border: 1px solid rgba(83, 200, 255, 0.16);
  border-radius: 14px;
  background: rgba(3, 14, 21, 0.45);
}

.sidebar-usuario-info {
  display: grid;
  gap: 5px;
}

.sidebar-usuario-etiqueta {
  display: block;
  margin-bottom: 4px;
  color: var(--color-text-muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sidebar-usuario strong {
  color: var(--color-text);
  font-size: 14px;
}

.sidebar-usuario-meta {
  color: rgba(202, 220, 229, 0.72);
  font-size: 12px;
  line-height: 1.45;
}

.sidebar-usuario-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 2px;
}

.sidebar-usuario-chip {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 8px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 999px;
  background: rgba(83, 200, 255, 0.08);
  color: rgba(236, 247, 251, 0.78);
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
}

.sidebar-usuario-boton {
  min-height: 38px;
  padding: 0 12px;
  border: 1px solid rgba(55, 230, 161, 0.24);
  border-radius: 10px;
  background: rgba(55, 230, 161, 0.1);
  color: var(--color-primary);
  font-size: 13px;
  font-weight: 750;
}

.sidebar-usuario-boton:hover {
  border-color: rgba(55, 230, 161, 0.46);
  background: rgba(55, 230, 161, 0.16);
}

.sidebar-salir-app {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  margin: 4px 0 14px;
  padding: 0 12px;
  border: 1px solid rgba(255, 107, 122, 0.14);
  border-radius: 10px;
  background: rgba(255, 107, 122, 0.045);
  color: #f2a5af;
  font-size: 12px;
  font-weight: 700;
  text-align: left;
  white-space: nowrap;
  transition:
    transform 0.2s ease,
    border-color 0.2s ease,
    background 0.2s ease,
    color 0.2s ease;
}

.sidebar-salir-app svg {
  width: 14px;
  height: 14px;
  fill: currentColor;
  flex: 0 0 auto;
}

.sidebar-salir-app span {
  line-height: 1;
}

.sidebar-salir-app:hover {
  transform: translateX(3px);
  border-color: rgba(255, 107, 122, 0.28);
  background: rgba(255, 107, 122, 0.075);
  color: #ffc0c7;
}

/* ITEMS */
.menu-item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  font-size: 17px;
  color: #e0e0e0;
  border-radius: 10px;
  cursor: pointer;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: rgba(255, 255, 255, 0.04);
  transition:
    background 0.25s ease,
    border-color 0.25s ease,
    color 0.25s ease,
    box-shadow 0.25s ease,
    transform 0.25s ease,
    filter 0.25s ease;
}

.menu-item:hover {
  background: rgba(0, 200, 83, 0.18);
  border-color: rgba(0, 200, 83, 0.45);
  color: #00ff88;
  box-shadow: inset 0 0 12px rgba(0, 255, 136, 0.25);
  transform: translateX(4px);
  filter: brightness(1.08);
}

.menu-item svg {
  width: 24px;
  height: 24px;
  fill: #d0d0d0;
  transition: fill 0.25s ease;
}

.menu-item:hover svg {
  fill: #00ff88;
}

/* Activo */
.menu-item.activo {
  background: rgba(0, 200, 83, 0.25);
  border-left: 5px solid #00ff88;
  color: #00ff88;
  box-shadow: inset 0 0 14px rgba(0, 255, 136, 0.25);
  filter: brightness(1.12);
}

.menu-item.activo svg {
  fill: #00ff88;
}

/* ===========================
   ILUMINACIÓN ACTIVA — ULTRA PRO
=========================== */

@keyframes iluminacionActiva {
  0% {
    box-shadow:
      inset 0 0 14px rgba(0, 255, 136, 0.25),
      6px 0 14px rgba(0, 255, 136, 0.25);
    filter: brightness(1.18);
  }
  50% {
    box-shadow:
      inset 0 0 22px rgba(0, 255, 136, 0.35),
      8px 0 18px rgba(0, 255, 136, 0.35);
    filter: brightness(1.28);
  }
  100% {
    box-shadow:
      inset 0 0 14px rgba(0, 255, 136, 0.25),
      6px 0 14px rgba(0, 255, 136, 0.25);
    filter: brightness(1.18);
  }
}

#sidebar div.activo {
  animation: iluminacionActiva 2.4s ease-in-out infinite;
}

/* ===========================
   CONTENIDO
=========================== */

#contenido {
  padding: 20px;
  margin-left: 280px !important;
  min-height: 100vh;
  overflow: visible;
  background: transparent !important;
}

.app-welcome {
  position: relative;
  margin: 18px 20px 0 294px;
  padding: 18px 20px;
  border: 1px solid rgba(55, 230, 161, 0.16);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.12), transparent 36%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.9), rgba(3, 14, 21, 0.72));
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.32),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
  z-index: 2;
}

.app-welcome[data-rol="premium"] {
  border-color: rgba(55, 230, 161, 0.24);
}

.app-welcome[data-rol="entrenador"] {
  border-color: rgba(83, 200, 255, 0.22);
}

.app-welcome[data-rol="jugador"] {
  border-color: rgba(255, 211, 90, 0.22);
}

.app-welcome-acento {
  width: 64px;
  height: 3px;
  margin-bottom: 10px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--color-primary), var(--color-accent));
  box-shadow: 0 0 18px rgba(55, 230, 161, 0.32);
}

.app-welcome-texto {
  display: grid;
  gap: 8px;
}

.app-welcome-etiqueta {
  display: inline-flex;
  width: fit-content;
  padding: 5px 9px;
  border-radius: 999px;
  background: rgba(83, 200, 255, 0.12);
  color: #7fdcff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.app-welcome-subtitulo {
  color: rgba(236, 247, 251, 0.78);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.app-welcome h2 {
  margin: 0;
  font-size: clamp(26px, 2.4vw, 34px);
  line-height: 1.05;
}

.app-welcome p {
  margin: 0;
  color: var(--color-text-muted);
  line-height: 1.5;
  max-width: 62ch;
}

.app-welcome.is-flash {
  animation: welcomeFlash 0.8s ease;
}

@keyframes welcomeFlash {
  0% {
    transform: translateY(-6px) scale(0.985);
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  }
  45% {
    transform: translateY(0) scale(1.01);
    box-shadow:
      0 18px 34px rgba(0, 0, 0, 0.32),
      0 0 0 1px rgba(83, 200, 255, 0.2);
  }
  100% {
    transform: translateY(0) scale(1);
    box-shadow:
      0 12px 28px rgba(0, 0, 0, 0.32),
      inset 0 0 0 1px rgba(255, 255, 255, 0.03);
  }
}

/* ===========================
   PANEL — UX PRO DEFINITIVO
=========================== */

.panel {
  position: absolute;
  top: 20px;
  left: 294px;
  right: 20px;

  max-height: calc(100vh - 40px);
  padding: 25px;

  /* Fondo PRO */
  background: rgba(15, 15, 15, 0.42);
  backdrop-filter: blur(18px) saturate(120%);
  -webkit-backdrop-filter: blur(18px) saturate(120%);

  /* Borde PRO */
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.1);

  /* Sombra PRO */
  box-shadow:
    0 10px 32px rgba(0, 0, 0, 0.55),
    inset 0 0 22px rgba(255, 255, 255, 0.05);

  /* Animación */
  opacity: 0;
  transform: translateY(12px);
  pointer-events: none;

  transition:
    opacity 0.28s ease,
    transform 0.28s ease,
    background 0.28s ease,
    box-shadow 0.28s ease;

  z-index: 1;

  overflow-y: auto;
  overflow-x: hidden;
  display: block;
}

.panel.visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  z-index: 5;
}

/* ===========================
   BLOQUES INTERNOS — UX PRO
=========================== */

.bloque {
  background: rgba(10, 10, 10, 0.38);
  backdrop-filter: blur(10px) saturate(130%);
  -webkit-backdrop-filter: blur(10px) saturate(130%);

  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);

  padding: 20px;
  margin-bottom: 22px;

  box-shadow:
    0 6px 18px rgba(0, 0, 0, 0.35),
    inset 0 0 14px rgba(255, 255, 255, 0.05);

  transition:
    background 0.25s ease,
    box-shadow 0.25s ease,
    transform 0.25s ease;
}

.bloque:hover {
  background: rgba(10, 10, 10, 0.45);
  box-shadow:
    0 10px 26px rgba(0, 0, 0, 0.45),
    inset 0 0 18px rgba(255, 255, 255, 0.06);

  transform: translateY(-2px);
}

/* ===========================
   INPUTS — UX PRO
=========================== */

.bloque input,
.bloque select {
  width: 100%;
  padding: 10px;
  margin: 8px 0 15px 0;
  border: 1px solid #333;
  background: #111;
  color: #fff;
  border-radius: 6px;
  font-size: 15px;
  transition:
    border-color 0.22s ease,
    box-shadow 0.22s ease,
    background 0.22s ease;
}

.bloque input:focus,
.bloque select:focus {
  border-color: #00c8ff;
  background: #0f1a1f;
  box-shadow: 0 0 8px rgba(0, 200, 255, 0.35);
  outline: none;
}

.bloque input:hover,
.bloque select:hover {
  border-color: #00aaff;
}

.bloque input::placeholder {
  color: #888;
  opacity: 0.7;
}

/* ===========================
   BOTONES — UX PRO
=========================== */

.btn-pro {
  padding: 12px 22px;
  background: linear-gradient(180deg, #00b7ff, #0099dd);
  border: none;
  color: #000;
  font-weight: bold;
  cursor: pointer;
  border-radius: 8px;
  font-size: 16px;
  letter-spacing: 0.3px;
  box-shadow:
    0 4px 10px rgba(0, 0, 0, 0.35),
    inset 0 0 8px rgba(255, 255, 255, 0.15);
  transition:
    background 0.22s ease,
    box-shadow 0.22s ease,
    transform 0.12s ease,
    filter 0.22s ease;
}

.btn-pro:hover {
  background: linear-gradient(180deg, #00c8ff, #00a3e6);
  box-shadow:
    0 6px 14px rgba(0, 0, 0, 0.45),
    inset 0 0 10px rgba(255, 255, 255, 0.2);
  transform: translateY(-2px);
  filter: brightness(1.08);
}

.btn-pro:active {
  transform: scale(0.96);
  filter: brightness(0.92);
}

/* Variantes */
.btn-crear {
  background: linear-gradient(180deg, #00ff88, #00cc66);
  color: #000;
}

.btn-crear:hover {
  background: linear-gradient(180deg, #00ff99, #00dd77);
}

.btn-guardar {
  background: linear-gradient(180deg, #ffbb00, #e6a300);
  color: #000;
}

.btn-guardar:hover {
  background: linear-gradient(180deg, #ffcc33, #f0b820);
}

/* ===========================
   LISTAS — OPTIMIZACIÓN PRO
=========================== */

.listaEquipos,
.listaSesiones {
  display: flex;
  flex-direction: column;
  gap: 22px;
  padding: 18px 12px;
  margin-top: 18px;
  overflow-y: auto;
  overflow-x: hidden;
}

/* ===========================
   LISTA DE JUGADORAS — GRID PRO
=========================== */

.listaJugadoras {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 22px;
  padding: 18px 12px;
  margin-top: 18px;
  overflow-y: auto;
  overflow-x: hidden;
}

/* ===========================
   TARJETAS DE JUGADORAS — UX PRO
=========================== */

.jugadora-card {
  background: rgba(15, 15, 15, 0.4);
  backdrop-filter: blur(10px) saturate(130%);
  -webkit-backdrop-filter: blur(10px) saturate(130%);
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  padding: 18px;
  margin-bottom: 18px;
  display: flex;
  align-items: center;
  gap: 20px;
  box-shadow:
    0 6px 18px rgba(0, 0, 0, 0.35),
    inset 0 0 14px rgba(255, 255, 255, 0.05);
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    background 0.25s ease;
}

.jugadora-card:hover {
  background: rgba(15, 15, 15, 0.48);
  transform: translateY(-3px);
  box-shadow:
    0 10px 26px rgba(0, 0, 0, 0.45),
    inset 0 0 18px rgba(255, 255, 255, 0.06);
}

/* ICONO */
.jugadora-icono {
  width: 48px;
  height: 48px;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(8px) saturate(140%);
  -webkit-backdrop-filter: blur(8px) saturate(140%);
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow:
    0 6px 18px rgba(0, 0, 0, 0.35),
    inset 0 0 12px rgba(255, 255, 255, 0.05);
  transition: transform 0.25s ease;
}

.jugadora-icono svg {
  width: 26px;
  height: 26px;
  fill: #ffdd55;
}

.jugadora-card:hover .jugadora-icono {
  transform: scale(1.08);
}

/* INFO */
.jugadora-info {
  flex: 1;
}

.jugadora-nombre {
  font-size: 20px;
  font-weight: bold;
  color: #00c8ff;
}

.jugadora-detalles {
  margin-top: 6px;
  color: #ccc;
  font-size: 14px;
  display: flex;
  gap: 12px;
}

/* ACCIONES */
.jugadora-acciones {
  display: flex;
  gap: 12px;
}

.jugadora-btn {
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  padding: 8px;
  border-radius: 8px;
  cursor: pointer;
  transition:
    background 0.2s ease,
    transform 0.2s ease;
}

.jugadora-btn:hover {
  background: rgba(255, 255, 255, 0.2);
  transform: scale(1.08);
}

/* FOTO DE JUGADORA */
.jugadora-foto {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  flex-shrink: 0;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ICONO SOLO CUANDO NO HAY FOTO */
.jugadora-foto.sin-foto {
  background-image: none !important;
  background-color: #f0f0f0;
}

.jugadora-foto.sin-foto svg {
  width: 40px;
  height: 40px;
  fill: #666;
}

/* IMPORTANTE: NO TAPAR LA FOTO */
.jugadora-foto svg {
  display: none;
}

/* ===========================
   FOTO PRO+ CON COLORES POR POSICIÓN
=========================== */

.jugadora-card.colocadora .jugadora-foto {
  border-color: #00c8ff;
  box-shadow:
    0 0 12px rgba(0, 200, 255, 0.45),
    inset 0 0 10px rgba(255, 255, 255, 0.15);
}

.jugadora-card.receptora .jugadora-foto {
  border-color: #ffdd55;
  box-shadow:
    0 0 12px rgba(255, 221, 85, 0.45),
    inset 0 0 10px rgba(255, 255, 255, 0.15);
}

.jugadora-card.opuesta .jugadora-foto {
  border-color: #ff6b6b;
  box-shadow:
    0 0 12px rgba(255, 107, 107, 0.45),
    inset 0 0 10px rgba(255, 255, 255, 0.15);
}

.jugadora-card.central .jugadora-foto {
  border-color: #7dff7d;
  box-shadow:
    0 0 12px rgba(125, 255, 125, 0.45),
    inset 0 0 10px rgba(255, 255, 255, 0.15);
}

.jugadora-card.líbero .jugadora-foto {
  border-color: #b388ff;
  box-shadow:
    0 0 12px rgba(179, 136, 255, 0.45),
    inset 0 0 10px rgba(255, 255, 255, 0.15);
}

/* Hover PRO */
.jugadora-card:hover .jugadora-foto {
  transform: scale(1.08);
  box-shadow:
    0 0 18px rgba(0, 200, 255, 0.65),
    inset 0 0 12px rgba(255, 255, 255, 0.25);
}

/* ===========================
   GLOW DINÁMICO POR POSICIÓN — PRO
=========================== */

/* Colocadora */
.jugadora-card.colocadora {
  box-shadow:
    0 0 12px rgba(0, 230, 118, 0.45),
    0 0 28px rgba(0, 230, 118, 0.25),
    inset 0 0 12px rgba(0, 230, 118, 0.2);
}

/* Receptora */
.jugadora-card.receptora {
  box-shadow:
    0 0 12px rgba(41, 121, 255, 0.45),
    0 0 28px rgba(41, 121, 255, 0.25),
    inset 0 0 12px rgba(41, 121, 255, 0.2);
}

/* Opuesta */
.jugadora-card.opuesta {
  box-shadow:
    0 0 12px rgba(255, 23, 68, 0.45),
    0 0 28px rgba(255, 23, 68, 0.25),
    inset 0 0 12px rgba(255, 23, 68, 0.2);
}

/* Central */
.jugadora-card.central {
  box-shadow:
    0 0 12px rgba(255, 145, 0, 0.45),
    0 0 28px rgba(255, 145, 0, 0.25),
    inset 0 0 12px rgba(255, 145, 0, 0.2);
}

/* Líbero */
.jugadora-card.líbero {
  box-shadow:
    0 0 12px rgba(0, 191, 165, 0.45),
    0 0 28px rgba(0, 191, 165, 0.25),
    inset 0 0 12px rgba(0, 191, 165, 0.2);
}

/* ===========================
   TARJETAS DE EQUIPOS — UX PRO
=========================== */

.equipo-card {
  background: rgba(12, 12, 12, 0.4);
  backdrop-filter: blur(12px) saturate(130%);
  -webkit-backdrop-filter: blur(12px) saturate(130%);

  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.1);

  padding: 20px;
  margin-bottom: 20px;

  display: flex;
  align-items: center;
  gap: 20px;

  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.45),
    inset 0 0 16px rgba(255, 255, 255, 0.05);

  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    background 0.25s ease;
}

.equipo-card:hover {
  background: rgba(12, 12, 12, 0.48);
  transform: translateY(-3px);

  box-shadow:
    0 12px 30px rgba(0, 0, 0, 0.55),
    inset 0 0 20px rgba(255, 255, 255, 0.06);
}

/* ===========================
   ICONO PRO
=========================== */

.equipo-card-icono {
  width: 48px;
  height: 48px;

  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(8px) saturate(140%);
  -webkit-backdrop-filter: blur(8px) saturate(140%);

  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.15);

  display: flex;
  justify-content: center;
  align-items: center;

  box-shadow:
    0 6px 18px rgba(0, 0, 0, 0.35),
    inset 0 0 12px rgba(255, 255, 255, 0.05);

  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.equipo-card-icono svg {
  width: 26px;
  height: 26px;
  fill: #00c8ff;
}

.equipo-card:hover .equipo-card-icono {
  transform: scale(1.08);
}

/* ===========================
   NOMBRE DEL EQUIPO
=========================== */

.equipo-card-nombre {
  font-size: 22px;
  font-weight: bold;
  color: #00c8ff;
  letter-spacing: 0.5px;
  flex: 1;
}

/* ===========================
   STATS
=========================== */

.equipo-card-stats {
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: #ccc;
  font-size: 14px;
  min-width: 120px;
}

/* ===========================
   ACCIONES
=========================== */

.equipo-card-acciones {
  display: flex;
  gap: 12px;
}

.equipo-btn {
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);

  padding: 8px;
  border-radius: 8px;

  cursor: pointer;
  transition:
    background 0.2s ease,
    transform 0.2s ease;
}

.equipo-btn:hover {
  background: rgba(255, 255, 255, 0.2);
  transform: scale(1.08);
}

.equipo-btn svg {
  width: 20px;
  height: 20px;
  fill: #fff;
}

/* ===========================
   EQUIPOS — LAYOUT PRO
=========================== */

.item-equipo {
  padding: 16px 18px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: 0.25s ease;
}

.item-equipo:hover {
  background: rgba(0, 200, 83, 0.18);
  border-color: rgba(0, 200, 83, 0.45);
  transform: translateY(-3px);
  box-shadow: 0 6px 18px rgba(0, 255, 136, 0.25);
}

.item-equipo-nombre span {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 18px;
  color: #e0e0e0;
}

.item-equipo .acciones {
  display: flex;
  gap: 10px;
  margin-top: 6px;
}

/* Avatar equipo */
.equipo-avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}

/* Jerarquía visual PRO */
.item-equipo-nombre {
  font-size: 18px;
  font-weight: 600;
  color: #e0e0e0;
  margin-bottom: 6px;
}

.item-equipo-info {
  margin-bottom: 8px;
}

/* Contadores PRO */
.item-equipo-info {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  font-size: 15px;
  color: #cfcfcf;
}

.item-equipo-info span {
  display: flex;
  align-items: center;
  gap: 6px;
}

/* ===========================
   ACCIONES PRO (EDITAR / ELIMINAR)
=========================== */

.acciones {
  display: flex;
  gap: 8px;
}

.btn-accion {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border: 1px solid rgba(255, 255, 255, 0.25);
  transition:
    background 0.2s ease,
    transform 0.1s ease;
}

.btn-accion:hover {
  background: rgba(255, 255, 255, 0.25);
  transform: scale(1.05);
}

.btn-accion svg {
  width: 18px;
  height: 18px;
  fill: #ffffff;
  transition: fill 0.2s ease;
}

.btn-editar {
  border-color: rgba(0, 200, 0, 0.45);
  background: rgba(0, 200, 0, 0.15);
}

.btn-editar:hover {
  background: rgba(0, 200, 0, 0.25);
}

.btn-eliminar {
  border-color: rgba(255, 0, 0, 0.45);
  background: rgba(255, 0, 0, 0.15);
}

.btn-eliminar:hover {
  background: rgba(255, 0, 0, 0.25);
}

body.delete-guard-open {
  overflow: hidden;
}

.delete-guard-overlay {
  position: fixed;
  inset: 0;
  z-index: 30000;
  display: grid;
  place-items: center;
  padding: 28px;
  background: rgba(1, 8, 13, 0.82);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.delete-guard-dialog {
  width: min(680px, 100%);
  max-height: min(820px, calc(100vh - 56px));
  overflow-y: auto;
  padding: 30px;
  border: 1px solid rgba(83, 200, 255, 0.2);
  border-radius: 26px;
  background:
    radial-gradient(circle at top right, rgba(83, 200, 255, 0.12), transparent 38%),
    linear-gradient(155deg, #091923, #061119 72%);
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.62);
}

.delete-guard-dialog--danger {
  border-color: rgba(255, 113, 132, 0.3);
  background:
    radial-gradient(circle at top right, rgba(255, 86, 112, 0.12), transparent 38%),
    linear-gradient(155deg, #101720, #061119 72%);
}

.delete-guard-eyebrow {
  display: block;
  margin-bottom: 8px;
  color: #45dda8;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.12em;
}

.delete-guard-dialog--danger .delete-guard-eyebrow {
  color: #ff8fa1;
}

.delete-guard-dialog h2 {
  margin: 0 0 18px;
  color: #f3f8fb;
  font-size: clamp(25px, 3vw, 34px);
  letter-spacing: -0.04em;
}

.delete-guard-intro,
.delete-guard-message,
.delete-guard-hint {
  color: #aebdca;
  line-height: 1.55;
  white-space: pre-line;
}

.delete-guard-summary {
  display: grid;
  gap: 8px;
  margin: 22px 0;
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  background: rgba(1, 12, 18, 0.62);
}

.delete-guard-summary p {
  margin: 0;
  color: #dbe5ec;
}

.delete-guard-summary .delete-guard-warning {
  color: #ffb3bf;
  font-weight: 750;
}

.delete-guard-label {
  display: block;
  margin-top: 20px;
  color: #c9d5dd;
  font-weight: 700;
}

.delete-guard-expected {
  display: block;
  margin: 8px 0 12px;
  color: #ffffff;
  font-size: 18px;
}

.delete-guard-input {
  width: 100%;
  padding: 14px 16px;
  border: 1px solid rgba(255, 143, 161, 0.34);
  border-radius: 14px;
  outline: none;
  background: rgba(1, 10, 15, 0.88);
  color: #ffffff;
  font: inherit;
}

.delete-guard-input:focus {
  border-color: #ff8fa1;
  box-shadow: 0 0 0 4px rgba(255, 143, 161, 0.1);
}

.delete-guard-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 24px;
}

.delete-guard-button {
  min-height: 48px;
  padding: 0 20px;
  border: 1px solid transparent;
  border-radius: 14px;
  cursor: pointer;
  font: inherit;
  font-weight: 850;
}

.delete-guard-button--secondary {
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.05);
  color: #d5e0e7;
}

.delete-guard-button--primary {
  background: linear-gradient(135deg, #53c8ff, #3fe0ad);
  color: #031019;
}

.delete-guard-button--danger {
  border-color: rgba(255, 143, 161, 0.36);
  background: rgba(255, 83, 108, 0.17);
  color: #ffb3bf;
}

.delete-guard-button:disabled {
  cursor: not-allowed;
  opacity: 0.38;
}

@media (max-width: 720px) {
  .delete-guard-overlay {
    padding: 14px;
  }

  .delete-guard-dialog {
    padding: 22px;
    border-radius: 20px;
  }

  .delete-guard-actions {
    flex-direction: column-reverse;
  }

  .delete-guard-button {
    width: 100%;
  }
}

/* ===========================
   VIDEO
=========================== */

video {
  border: 2px solid #00aaff;
  border-radius: 10px;
}

/* ===========================
   NUEVA JUGADORA
=========================== */

#panelNuevaJugadora label {
  font-size: 14px;
  color: #ccc;
}

/* ===========================
   PESTAÑAS POR EQUIPO
=========================== */

.tabs-equipos {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.tab-equipo {
  padding: 8px 14px;
  background: #222;
  color: #fff;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.2s;
  border: 1px solid #333;
}

.tab-equipo:hover {
  background: #333;
}

.tab-equipo.activa {
  background: #00aaff;
  color: #000;
  border-color: #00aaff;
}

/* ===========================
   BOTONES SESIONES
=========================== */

.btn-editar-sesion,
.btn-eliminar-sesion {
  padding: 6px 12px;
  border-radius: 6px;
  border: none;
  cursor: pointer;
  font-weight: bold;
}

.btn-editar-sesion {
  background: #ffaa00;
  color: #000;
}

.btn-eliminar-sesion {
  background: #ff4444;
  color: #fff;
}

/* ===========================
   CALENDARIO GRANDE
=========================== */

#calendarioGrande {
  background: #000;
  padding: 20px;
  border-radius: 10px;
  border: 1px solid #222;
  width: 360px;
  color: #fff;
}

.cal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}

.cal-header button {
  background: #00aaff;
  border: none;
  padding: 6px 10px;
  border-radius: 6px;
  cursor: pointer;
  font-weight: bold;
}

.cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
}

.cal-day {
  padding: 10px;
  background: #111;
  border: 1px solid #222;
  text-align: center;
  cursor: pointer;
  border-radius: 6px;
}

.cal-day:hover {
  background: #00aaff;
  color: #000;
}

.cal-day.selected {
  background: #00ff88;
  color: #000;
  font-weight: bold;
}

.input-hora-grande {
  width: 200px;
  padding: 10px;
  font-size: 18px;
  background: #111;
  color: #fff;
  border: 1px solid #333;
  border-radius: 6px;
}

/* ===========================
   MODAL — GLASSMORPHISM PRO
=========================== */

.modal-pro {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.65);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);

  /* 🔥 CLAVE: el modal debe estar SIEMPRE por encima de los paneles */
  z-index: 9999;

  align-items: center;
  justify-content: center;

  opacity: 0;
  transition: opacity 0.35s ease;
}

.modal-pro.visible {
  display: flex;
  opacity: 1;
}

.modal-contenido {
  background: rgba(20, 20, 20, 0.32);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);

  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 26px 30px;
  border-radius: 16px;
  min-width: 360px;
  max-width: min(92vw, 460px);

  border: 1px solid rgba(255, 255, 255, 0.12);

  box-shadow:
    0 12px 32px rgba(0, 0, 0, 0.55),
    inset 0 0 22px rgba(255, 255, 255, 0.06);

  transform: scale(0.92) translateY(14px);
  transition:
    transform 0.35s ease,
    box-shadow 0.35s ease,
    background 0.35s ease;
}

.modal-pro.visible .modal-contenido {
  transform: scale(1) translateY(0);
}

.modal-contenido label {
  color: var(--color-text-muted);
  font-size: 13px;
  font-weight: 650;
  letter-spacing: 0.01em;
}

.modal-contenido input {
  width: 100%;
}

.modal-contenido-login {
  min-width: min(92vw, 560px);
  padding: 22px 24px 18px;
  gap: 14px;
  background:
    linear-gradient(180deg, rgba(12, 26, 34, 0.96), rgba(6, 16, 22, 0.94));
  border: 1px solid rgba(83, 200, 255, 0.16);
  box-shadow:
    0 20px 60px rgba(0, 0, 0, 0.6),
    0 0 0 1px rgba(255, 255, 255, 0.03) inset;
}

.modal-login-resumen {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.modal-login-resumen-card {
  padding: 12px 12px 11px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 14px;
  background: rgba(3, 14, 21, 0.5);
}

.modal-login-resumen-etiqueta {
  color: var(--color-text-muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.modal-login-resumen-card strong {
  display: block;
  margin-top: 6px;
  color: var(--color-text);
  font-size: 13px;
}

.modal-login-resumen-card span {
  display: block;
  margin-top: 4px;
  color: rgba(202, 220, 229, 0.72);
  font-size: 12px;
  line-height: 1.45;
}

.modal-login-campos {
  display: grid;
  gap: 8px;
  margin-top: 4px;
}

.modal-login-campos input {
  width: 100%;
  min-height: 46px;
  padding: 10px 12px;
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: rgba(3, 14, 21, 0.72);
  color: var(--color-text);
  box-sizing: border-box;
}

.modal-login-campos input:focus {
  border-color: var(--color-accent);
  box-shadow: 0 0 0 4px rgba(83, 200, 255, 0.12);
  outline: none;
}

.modal-login-demo {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.modal-login-demo-btn {
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid rgba(83, 200, 255, 0.18);
  border-radius: 999px;
  background: rgba(83, 200, 255, 0.08);
  color: var(--color-text);
  font-size: 12px;
  font-weight: 750;
}

.modal-login-demo-btn:hover {
  border-color: rgba(55, 230, 161, 0.42);
  background: rgba(55, 230, 161, 0.12);
  color: var(--color-primary);
}

.modal-acciones {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 2px;
}

@media (max-width: 720px) {
  .modal-login-resumen {
    grid-template-columns: 1fr;
  }
}

.modal-contenido-confirmacion {
  min-width: min(92vw, 520px);
  padding: 22px 24px 18px;
  gap: 12px;
  background:
    linear-gradient(180deg, rgba(12, 26, 34, 0.96), rgba(6, 16, 22, 0.94));
  border: 1px solid rgba(83, 200, 255, 0.16);
  box-shadow:
    0 20px 60px rgba(0, 0, 0, 0.6),
    0 0 0 1px rgba(255, 255, 255, 0.03) inset;
}

.modal-confirmacion-acento {
  width: 64px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--color-primary), var(--color-accent));
  box-shadow: 0 0 18px rgba(55, 230, 161, 0.32);
}

.modal-icono-confirmacion {
  display: flex;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(55, 230, 161, 0.16), rgba(83, 200, 255, 0.14));
  border: 1px solid rgba(83, 200, 255, 0.22);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.modal-icono-confirmacion svg {
  width: 24px;
  height: 24px;
  fill: var(--color-accent);
}

.modal-confirmacion-texto {
  display: grid;
  gap: 6px;
}

.modal-confirmacion-texto h3 {
  margin: 0;
  font-size: 21px;
  letter-spacing: -0.02em;
}

.modal-confirmacion-texto p {
  margin: 0;
  color: var(--color-text-muted);
  line-height: 1.55;
  font-size: 14px;
}

.modal-acciones-confirmacion {
  justify-content: flex-end;
  flex-wrap: wrap;
  margin-top: 10px;
}

.modal-acciones-confirmacion .btn-cancelar {
  background: rgba(255, 255, 255, 0.06);
  color: var(--color-text);
  box-shadow: none;
  border-color: rgba(255, 255, 255, 0.08);
}

.modal-acciones-confirmacion .btn-cancelar:hover {
  filter: brightness(1.1);
}

.modal-acciones-confirmacion .btn-crear {
  box-shadow: 0 12px 28px rgba(32, 201, 133, 0.22);
}

.sesion-seccion {
  margin-top: 28px;
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.sesion-seccion h3 {
  margin-bottom: 16px;
}

.sesion-avanzada-aviso {
  margin: -4px 0 18px;
  padding: 12px 14px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 16px;
  background:
    linear-gradient(180deg, rgba(3, 17, 25, 0.72), rgba(3, 14, 21, 0.56));
  color: var(--color-text-muted);
  font-size: 13px;
  line-height: 1.5;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 10px 22px rgba(0, 0, 0, 0.12);
}

.sesion-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 16px;
}

.sesion-tab {
  padding: 10px 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 999px;
  background: rgba(3, 14, 21, 0.72);
  color: var(--color-text-muted);
}

.sesion-tab.activa {
  border-color: rgba(55, 230, 161, 0.38);
  background: rgba(55, 230, 161, 0.14);
  color: var(--color-primary);
}

.sesion-tab-panes {
  display: grid;
  gap: 16px;
}

.sesion-tab-pane {
  display: none;
  padding: 18px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 22px;
  background:
    radial-gradient(circle at top right, rgba(83, 200, 255, 0.07), transparent 32%),
    linear-gradient(180deg, rgba(3, 14, 21, 0.7), rgba(3, 14, 21, 0.52));
  box-shadow:
    0 16px 36px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.sesion-tab-pane.activa {
  display: grid;
  gap: 16px;
}

.sesion-bloque-recursos {
  display: grid;
  gap: 14px;
  padding: 16px 16px 18px;
  border: 1px solid rgba(83, 200, 255, 0.18);
  border-radius: 22px;
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.08), transparent 28%),
    linear-gradient(180deg, rgba(4, 19, 27, 0.9), rgba(3, 17, 25, 0.7));
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.03),
    0 14px 30px rgba(0, 0, 0, 0.18);
}

.sesion-bloque-media-header {
  display: grid;
  gap: 5px;
}

.sesion-bloque-media-title {
  color: #a7d9eb;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sesion-bloque-media-desc {
  color: var(--color-text-muted);
  font-size: 13px;
  line-height: 1.45;
}

.sesion-bloque-media-title,
.sesion-bloque-media-desc {
  max-width: 60ch;
}

.sesion-recurso-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px 14px;
  align-items: end;
  padding: 16px;
  border: 1px solid rgba(83, 200, 255, 0.22);
  border-radius: 20px;
  background:
    radial-gradient(circle at top left, rgba(83, 200, 255, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(5, 24, 34, 0.9), rgba(3, 17, 25, 0.68));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 12px 24px rgba(0, 0, 0, 0.18);
}

.sesion-recurso-form input[type="file"] {
  width: 100%;
  grid-column: 1 / 2;
}

.sesion-recurso-form .btn-pro {
  width: 100%;
  min-width: 188px;
  background: linear-gradient(135deg, #58e8ff, #3daee8);
  color: #04141d;
  box-shadow: 0 10px 18px rgba(61, 174, 232, 0.2);
}

.sesion-recurso-form .btn-pro:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 20px rgba(61, 174, 232, 0.28);
}

.sesion-media-campo {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.sesion-media-label {
  color: #b9dbe8;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sesion-editor-texto {
  display: block;
  position: relative;
  z-index: 1;
  width: 100%;
  min-height: 180px;
  padding: 16px 18px;
  border: 1px solid rgba(83, 200, 255, 0.16);
  border-radius: 22px;
  background:
    linear-gradient(180deg, rgba(3, 14, 21, 0.82), rgba(3, 17, 25, 0.7));
  color: var(--color-text);
  font: inherit;
  line-height: 1.55;
  caret-color: var(--color-primary);
  resize: vertical;
  box-sizing: border-box;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  outline: none;
  min-height: 180px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 14px 28px rgba(0, 0, 0, 0.18);
}

.sesion-tab-pane textarea {
  width: 100%;
}

.sesion-editor-texto:empty::before {
  color: #7f98a6;
  content: attr(data-placeholder);
}

.sesion-editor-texto:focus {
  border-color: rgba(83, 200, 255, 0.56);
  background: rgba(5, 22, 31, 0.92);
  box-shadow:
    0 0 0 4px rgba(83, 200, 255, 0.12),
    0 18px 32px rgba(0, 0, 0, 0.2);
}

.sesion-tab-pane textarea::placeholder {
  color: #7f98a6;
  opacity: 1;
}

.sesion-tab-pane input[type="url"] {
  width: 100%;
  min-height: 44px;
  padding: 12px 14px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 16px;
  background: rgba(3, 14, 21, 0.76);
  color: var(--color-text);
  box-sizing: border-box;
}

.sesion-tab-pane input[type="file"] {
  width: 100%;
  padding: 11px 12px;
  border: 1px solid rgba(83, 200, 255, 0.16);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.03);
  color: var(--color-text-muted);
  box-sizing: border-box;
}

.sesion-media-toolbar {
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 16px;
}

.sesion-media-toolbar .btn-pro {
  justify-self: stretch;
  width: auto;
}

.sesion-media-toolbar .sesion-media-campo {
  grid-column: 1 / 2;
}

.sesion-media-toolbar .sesion-media-campo + .btn-pro {
  grid-column: 2 / 3;
}

.sesion-tab-pane .sesion-bloque-recursos input[type="url"] {
  min-height: 44px;
}

.sesion-bloque textarea,
.sesion-recurso-inputs input {
  width: 100%;
}

.sesion-bloque textarea {
  min-height: 110px;
  resize: vertical;
}

.sesion-recursos-form {
  display: grid;
  gap: 12px;
}

.sesion-recurso-inputs {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}

.sesion-recursos-lista {
  display: grid;
  gap: 12px;
}

.sesion-recurso-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 15px 16px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 18px;
  background:
    radial-gradient(circle at top left, rgba(83, 200, 255, 0.08), transparent 22%),
    linear-gradient(180deg, rgba(3, 14, 21, 0.78), rgba(3, 17, 25, 0.6));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 10px 20px rgba(0, 0, 0, 0.12);
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.sesion-recurso-item:hover {
  transform: translateY(-1px);
  border-color: rgba(83, 200, 255, 0.24);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 14px 24px rgba(0, 0, 0, 0.16);
}

.sesion-recurso-info {
  display: grid;
  gap: 4px;
  min-width: 0;
  flex: 1;
}

.sesion-recurso-vista {
  display: grid;
  gap: 4px;
}

.sesion-recurso-cabecera {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: baseline;
  min-width: 0;
}

.sesion-recurso-editor {
  display: grid;
  gap: 8px;
  margin-top: 2px;
}

.sesion-recurso-editor-input {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: rgba(3, 14, 21, 0.78);
  color: var(--color-text);
  box-sizing: border-box;
}

.sesion-recurso-tipo {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-text-muted);
}

.sesion-recurso-titulo {
  display: block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.entrenamiento-layout {
  display: grid;
  grid-template-columns: minmax(300px, 390px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.entrenamiento-layout.modo-jugador {
  gap: 20px;
}

.entrenamiento-layout.modo-jugador .entrenamiento-selector {
  display: none;
}

.entrenamiento-layout.modo-jugador .entrenamiento-detalle {
  padding: 20px;
  border-color: rgba(55, 230, 161, 0.14);
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.08), transparent 28%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.5), rgba(3, 14, 21, 0.58));
  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.28),
    inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}

.entrenamiento-layout.modo-jugador .entrenamiento-bloques {
  gap: 16px;
}

.entrenamiento-layout.modo-jugador .entrenamiento-proxima-sesion {
  padding: 20px 22px;
  border-color: rgba(55, 230, 161, 0.32);
}

.entrenamiento-layout.modo-jugador .entrenamiento-proxima-sesion h3 {
  font-size: 22px;
}

.entrenamiento-layout.modo-jugador .entrenamiento-proxima-sesion p {
  color: var(--color-text);
  opacity: 0.88;
}

.entrenamiento-layout.modo-jugador .entrenamiento-proxima-sesion-resumen span,
.entrenamiento-layout.modo-jugador .entrenamiento-proxima-sesion-bloques span {
  border-color: rgba(55, 230, 161, 0.18);
  background: rgba(3, 17, 25, 0.7);
}

.entrenamiento-layout.modo-jugador .entrenamiento-bloque {
  border-color: rgba(55, 230, 161, 0.12);
}

.sesiones-resumen-premium {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

.sesiones-resumen-premium-card {
  display: grid;
  gap: 7px;
  padding: 18px 20px;
  border: 1px solid rgba(55, 230, 161, 0.16);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.12), transparent 36%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.88), rgba(3, 14, 21, 0.68));
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.3),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.sesiones-resumen-premium-etiqueta {
  display: inline-flex;
  width: fit-content;
  padding: 5px 9px;
  border-radius: 999px;
  background: rgba(55, 230, 161, 0.12);
  color: var(--color-primary);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sesiones-resumen-premium-card strong {
  font-size: 18px;
}

.sesiones-resumen-premium-card span {
  color: var(--color-text-muted);
}

.sesiones-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  margin: 12px 0 16px;
}

.sesiones-toolbar input {
  min-height: 46px;
  padding: 0 14px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 14px;
  background: rgba(3, 14, 21, 0.7);
  color: var(--color-text);
}

.sesiones-toolbar input::placeholder {
  color: #7f95a0;
}

.sesiones-toolbar .btn-secundario[aria-pressed="true"] {
  border-color: rgba(55, 230, 161, 0.26);
  background: rgba(55, 230, 161, 0.12);
  color: #8ef0cf;
}

.entrenamiento-proxima-sesion {
  display: grid;
  gap: 12px;
  padding: 18px 20px;
  border: 1px solid rgba(55, 230, 161, 0.22);
  border-radius: 22px;
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.14), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.92), rgba(3, 14, 21, 0.72));
  box-shadow:
    0 14px 32px rgba(0, 0, 0, 0.34),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.entrenamiento-proxima-sesion-cabecera {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.entrenamiento-proxima-sesion-etiqueta {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  margin-bottom: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(55, 230, 161, 0.12);
  color: var(--color-primary);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.entrenamiento-proxima-sesion h3 {
  margin: 0;
  font-size: 20px;
}

.entrenamiento-proxima-sesion p {
  margin: 6px 0 0;
  color: var(--color-text-muted);
}

.entrenamiento-proxima-sesion-resumen {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.entrenamiento-proxima-sesion-resumen span,
.entrenamiento-proxima-sesion-bloques span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 999px;
  background: rgba(3, 17, 25, 0.62);
  color: var(--color-text);
  font-size: 12px;
  font-weight: 650;
}

.entrenamiento-proxima-sesion-bloques {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.entrenamiento-proxima-sesion .btn-secundario {
  white-space: nowrap;
}

.panel-headline {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 12px;
}

.panel-headline h2 {
  margin-bottom: 8px;
  letter-spacing: -0.06em;
}

.panel-subtitulo {
  margin: 0;
  color: #9eb1ba;
}

.panel-hero-premium {
  display: grid;
  gap: 14px;
  margin: 18px 0 18px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.panel-hero-premium-card {
  position: relative;
  overflow: hidden;
  display: grid;
  gap: 8px;
  padding: 18px 18px 16px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.1), transparent 35%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.94), rgba(3, 14, 21, 0.76));
  box-shadow:
    0 16px 34px rgba(0, 0, 0, 0.3),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.panel-hero-premium-card::after {
  content: "";
  position: absolute;
  inset: auto -18px -18px auto;
  width: 84px;
  height: 84px;
  border-radius: 28px;
  background: radial-gradient(circle, rgba(48, 216, 154, 0.14), transparent 68%);
  filter: blur(10px);
  pointer-events: none;
}

.panel-hero-premium-etiqueta {
  display: inline-flex;
  width: fit-content;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(48, 216, 154, 0.1);
  color: #8ef0cf;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.panel-hero-premium-card strong {
  font-size: 18px;
  letter-spacing: -0.03em;
}

.panel-hero-premium-card span {
  color: #9eb1ba;
  line-height: 1.5;
}

.panel-hero-equipos {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.panel-hero-jugadoras {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.panel-hero-lista {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.panel-hero-dashboard {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.panel-hero-estadisticas {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.sesion-headline-premium {
  align-items: flex-start;
}

.sesiones-hero-premium {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 16px 0 16px;
}

.sesiones-hero-premium-card {
  position: relative;
  overflow: hidden;
  display: grid;
  gap: 8px;
  padding: 16px 17px 15px;
  border: 1px solid rgba(55, 230, 161, 0.14);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.12), transparent 35%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.9), rgba(3, 14, 21, 0.7));
  box-shadow:
    0 14px 30px rgba(0, 0, 0, 0.28),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.sesiones-hero-premium-card::after {
  content: "";
  position: absolute;
  inset: auto -18px -18px auto;
  width: 84px;
  height: 84px;
  border-radius: 28px;
  background: radial-gradient(circle, rgba(83, 200, 255, 0.18), transparent 68%);
  filter: blur(10px);
  pointer-events: none;
}

.sesiones-hero-premium-etiqueta {
  display: inline-flex;
  width: fit-content;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(55, 230, 161, 0.12);
  color: var(--color-primary);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sesiones-hero-premium-card strong {
  font-size: 17px;
}

.sesiones-hero-premium-card span {
  color: var(--color-text-muted);
  line-height: 1.5;
}

.panel-resumen-premium {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin: 12px 0 16px;
}

.panel-resumen-premium-card {
  display: grid;
  gap: 7px;
  padding: 16px 18px;
  border: 1px solid rgba(55, 230, 161, 0.16);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.12), transparent 36%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.88), rgba(3, 14, 21, 0.68));
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.3),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.panel-resumen-premium-etiqueta {
  display: inline-flex;
  width: fit-content;
  padding: 5px 9px;
  border-radius: 999px;
  background: rgba(55, 230, 161, 0.12);
  color: var(--color-primary);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.panel-resumen-premium-card strong {
  font-size: 20px;
}

.panel-resumen-premium-card span {
  color: var(--color-text-muted);
}

.entrenamiento-selector {
  display: grid;
  gap: 8px;
  max-width: 100%;
  padding: 18px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 22px;
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.05), transparent 36%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.88), rgba(3, 14, 21, 0.66));
  box-shadow:
    0 16px 36px rgba(0, 0, 0, 0.22),
    inset 0 0 0 1px rgba(255, 255, 255, 0.02);
  position: sticky;
  top: 18px;
  align-content: start;
}

.entrenamiento-recientes {
  display: grid;
  gap: 8px;
}

.entrenamiento-acceso-grupo {
  display: grid;
  gap: 8px;
}

.entrenamiento-acceso-grupo-titulo {
  color: var(--color-text-muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.entrenamiento-reciente-chip {
  display: grid;
  gap: 3px;
  width: 100%;
  padding: 9px 11px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 14px;
  background: rgba(3, 14, 21, 0.55);
  color: var(--color-text);
  text-align: left;
  transition:
    transform var(--transition-fast),
    border-color var(--transition-fast),
    background var(--transition-fast);
}

.entrenamiento-reciente-chip strong {
  font-size: 12px;
  line-height: 1.25;
}

.entrenamiento-reciente-chip span {
  color: var(--color-text-muted);
  font-size: 11px;
}

.entrenamiento-reciente-chip:hover {
  transform: translateY(-1px);
  border-color: rgba(55, 230, 161, 0.28);
  background: rgba(3, 17, 25, 0.72);
}

.entrenamiento-reciente-chip.activo {
  border-color: rgba(55, 230, 161, 0.48);
  background: linear-gradient(180deg, rgba(55, 230, 161, 0.18), rgba(3, 17, 25, 0.72));
  box-shadow: 0 0 0 1px rgba(55, 230, 161, 0.16) inset;
}

.entrenamiento-reciente-chip.favorita {
  border-color: rgba(255, 211, 90, 0.24);
}

.entrenamiento-selector input[type="text"] {
  width: 100%;
  min-height: 46px;
  padding: 11px 13px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: rgba(3, 14, 21, 0.72);
  color: var(--color-text);
  box-sizing: border-box;
}

.entrenamiento-selector select {
  width: 100%;
  min-height: 46px;
  padding: 11px 13px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: rgba(3, 14, 21, 0.72);
  color: var(--color-text);
}

.entrenamiento-selector .btn-secundario {
  width: fit-content;
}

.entrenamiento-selector .btn-secundario,
.entrenamiento-acciones-barra .btn-secundario,
.entrenamiento-proxima-sesion .btn-secundario {
  border-color: rgba(83, 200, 255, 0.12);
  background: rgba(83, 200, 255, 0.07);
  color: #8fdcff;
}

.entrenamiento-selector .btn-secundario[aria-pressed="true"] {
  border-color: rgba(55, 230, 161, 0.28);
  background: rgba(55, 230, 161, 0.12);
  color: var(--color-primary);
}

.entrenamiento-selector .btn-secundario#btnEntrenamientoSoloFavoritas[aria-pressed="true"] {
  border-color: rgba(255, 211, 90, 0.3);
  background: rgba(255, 211, 90, 0.1);
  color: #ffd65a;
}

.entrenamiento-acciones-barra {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.entrenamiento-acciones-barra .btn-secundario[aria-pressed="true"] {
  border-color: rgba(255, 211, 90, 0.3);
  background: rgba(255, 211, 90, 0.1);
  color: #ffd65a;
}

.entrenamiento-detalle {
  display: grid;
  gap: 10px;
  padding: 20px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 20px;
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.06), transparent 28%),
    linear-gradient(180deg, rgba(3, 14, 21, 0.56), rgba(3, 17, 25, 0.4));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.02),
    0 12px 26px rgba(0, 0, 0, 0.14);
}

.entrenamiento-vista {
  display: grid;
  gap: 18px;
}

.entrenamiento-vista-lista {
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  align-items: start;
}

.entrenamiento-vista-detalle {
  gap: 14px;
}

.entrenamiento-vista-detalle[hidden],
.entrenamiento-vista-lista[hidden] {
  display: none !important;
}

#panelEntrenamiento.entrenamiento-modo-detalle .entrenamiento-vista-lista {
  display: none !important;
}

#panelEntrenamiento.entrenamiento-modo-detalle .entrenamiento-vista-detalle {
  display: grid !important;
  grid-template-columns: 1fr;
  width: 100%;
  max-width: 100%;
}

#panelEntrenamiento.entrenamiento-modo-detalle .entrenamiento-detalle {
  width: 100%;
  max-width: none;
  padding: 24px;
}

#panelEntrenamiento.entrenamiento-modo-detalle .entrenamiento-detalle-cabecera {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 10px 0 12px;
  margin-bottom: 2px;
  backdrop-filter: blur(12px);
  background: linear-gradient(180deg, rgba(3, 14, 21, 0.94), rgba(3, 14, 21, 0.7));
}

#panelEntrenamiento.entrenamiento-modo-detalle .entrenamiento-bloques {
  gap: 18px;
}

#panelEntrenamiento.entrenamiento-modo-detalle .entrenamiento-bloque {
  border-color: rgba(83, 200, 255, 0.12);
}

#panelEntrenamiento.entrenamiento-modo-lista .entrenamiento-vista-detalle[hidden] {
  display: none !important;
}

#panelEntrenamiento.entrenamiento-modo-lista .entrenamiento-vista-lista {
  width: 100%;
}

.entrenamiento-detalle-cabecera {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 6px 2px 2px;
}

.entrenamiento-volver-lista {
  min-width: fit-content;
  white-space: nowrap;
}

.entrenamiento-detalle-cabecera-texto {
  display: grid;
  gap: 4px;
}

.entrenamiento-detalle-etiqueta {
  color: #8fdcff;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.entrenamiento-detalle-cabecera-texto p {
  margin: 0;
  color: var(--color-text-muted);
  font-size: 13px;
  line-height: 1.45;
}

.entrenamiento-favoritas {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.entrenamiento-favorita-chip {
  display: grid;
  gap: 2px;
  padding: 9px 11px;
  border: 1px solid rgba(93, 233, 181, 0.18);
  border-radius: 14px;
  background: rgba(3, 17, 25, 0.58);
  text-align: left;
}

.entrenamiento-favorita-chip strong {
  color: var(--color-text);
  font-size: 13px;
}

.entrenamiento-favorita-chip span {
  color: var(--color-text-muted);
  font-size: 12px;
}

.entrenamiento-detalle-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(210px, 260px);
  gap: 22px;
  align-items: stretch;
  padding: 26px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 24px;
  background:
    radial-gradient(circle at 88% 8%, rgba(55, 230, 161, 0.12), transparent 30%),
    linear-gradient(145deg, rgba(5, 24, 34, 0.94), rgba(3, 14, 21, 0.82));
  box-shadow:
    0 20px 44px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.entrenamiento-detalle-principal {
  display: grid;
  align-content: center;
  gap: 12px;
  min-width: 0;
}

.entrenamiento-detalle-kicker,
.entrenamiento-contenido-cabecera > div > span {
  color: #7fe5bf;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.entrenamiento-detalle-principal h3 {
  margin: 0;
  max-width: 900px;
  font-size: clamp(28px, 3vw, 42px);
  line-height: 1.02;
  letter-spacing: -0.045em;
}

.entrenamiento-detalle-principal .entrenamiento-meta {
  font-size: 15px;
  line-height: 1.5;
}

.entrenamiento-detalle-principal .entrenamiento-resumen-panel {
  margin-top: 2px;
}

.entrenamiento-acciones-barra {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 4px;
}

.entrenamiento-acciones-barra .btn-pro {
  min-height: 44px;
}

.entrenamiento-acciones-barra .btn-pro[aria-pressed="true"] {
  border-color: rgba(55, 230, 161, 0.42);
  background: rgba(55, 230, 161, 0.12);
  color: #8df0ca;
}

.entrenamiento-progreso {
  --progreso: 0deg;
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
  min-width: 0;
  padding: 18px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 20px;
  background: rgba(2, 12, 18, 0.5);
}

.entrenamiento-progreso-anillo {
  position: relative;
  display: grid;
  place-items: center;
  width: 96px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: conic-gradient(#35e6a1 var(--progreso), rgba(83, 200, 255, 0.12) 0);
  box-shadow: 0 0 34px rgba(55, 230, 161, 0.12);
}

.entrenamiento-progreso-anillo::before {
  content: "";
  position: absolute;
  inset: 9px;
  border: 1px solid rgba(83, 200, 255, 0.1);
  border-radius: inherit;
  background: #06151e;
}

.entrenamiento-progreso-anillo strong {
  position: relative;
  z-index: 1;
  color: var(--color-text);
  font-size: 21px;
  letter-spacing: -0.04em;
}

.entrenamiento-progreso-texto {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.entrenamiento-progreso-texto span {
  color: var(--color-text-muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.entrenamiento-progreso-texto strong {
  color: var(--color-text);
  font-size: 14px;
  line-height: 1.35;
}

.entrenamiento-contenido-cabecera {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-top: 4px;
  padding: 8px 4px 0;
}

.entrenamiento-contenido-cabecera > div {
  display: grid;
  gap: 4px;
}

.entrenamiento-contenido-cabecera h4 {
  margin: 0;
  font-size: clamp(22px, 2vw, 29px);
  letter-spacing: -0.04em;
}

.entrenamiento-contenido-contador {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 12px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 999px;
  background: rgba(3, 17, 25, 0.68);
  color: #a7d9eb;
  font-size: 12px;
  font-weight: 750;
}

#panelEntrenamiento.entrenamiento-modo-detalle .entrenamiento-favoritas {
  display: none !important;
}

#panelEntrenamiento.entrenamiento-modo-detalle .entrenamiento-bloque[data-tiene-contenido="false"] {
  border-style: dashed;
  opacity: 0.68;
}

@media (min-width: 1200px) {
  #panelEntrenamiento.entrenamiento-modo-detalle .entrenamiento-bloques {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }
}

@media (max-width: 900px) {
  .entrenamiento-detalle-hero {
    grid-template-columns: 1fr;
    padding: 18px;
  }

  .entrenamiento-progreso {
    grid-template-columns: 74px minmax(0, 1fr);
  }

  .entrenamiento-progreso-anillo {
    width: 74px;
  }

  .entrenamiento-acciones-barra {
    display: grid;
    grid-template-columns: 1fr;
  }

  .entrenamiento-contenido-cabecera {
    align-items: flex-start;
    flex-direction: column;
  }
}
.entrenamiento-meta {
  margin: 0;
  color: var(--color-text-muted);
}

.entrenamiento-resumen-panel {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.entrenamiento-resumen-chip {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 12px;
  border: 1px solid rgba(83, 200, 255, 0.16);
  border-radius: 999px;
  background: rgba(3, 17, 25, 0.7);
  color: var(--color-text);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0.02em;
}

.entrenamiento-bloques {
  display: grid;
  gap: 14px;
}

.entrenamiento-bloque {
  display: grid;
  gap: 10px;
  padding: 18px 18px 19px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 22px;
  background:
    radial-gradient(circle at top right, rgba(83, 200, 255, 0.08), transparent 28%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.72), rgba(3, 14, 21, 0.56));
  box-shadow:
    0 14px 30px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.entrenamiento-bloque-cabecera {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.entrenamiento-bloque:hover {
  transform: translateY(-1px);
  border-color: rgba(83, 200, 255, 0.22);
  box-shadow:
    0 16px 34px rgba(0, 0, 0, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.entrenamiento-bloque h4 {
  margin: 0;
}

.entrenamiento-bloque-estado {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 999px;
  background: rgba(3, 17, 25, 0.68);
  color: var(--color-text-muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
}

.entrenamiento-resumen {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  padding: 7px 11px;
  border: 1px solid rgba(83, 200, 255, 0.16);
  border-radius: 999px;
  background: rgba(3, 17, 25, 0.7);
  color: var(--color-text-muted);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0.02em;
}

.entrenamiento-texto {
  margin: 0;
  color: var(--color-text);
}

.entrenamiento-recursos {
  display: grid;
  gap: 12px;
  margin-top: 2px;
}

.entrenamiento-recurso {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 14px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 20px;
  background:
    radial-gradient(circle at top left, rgba(55, 230, 161, 0.08), transparent 24%),
    linear-gradient(180deg, rgba(3, 14, 21, 0.8), rgba(3, 17, 25, 0.64));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 8px 18px rgba(0, 0, 0, 0.12);
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.entrenamiento-recurso::before {
  content: "";
  width: 5px;
  align-self: stretch;
  border-radius: 999px;
  background: linear-gradient(180deg, #35e6a1, #53c8ff);
  opacity: 0.9;
}

.entrenamiento-recurso:hover {
  transform: translateY(-1px);
  border-color: rgba(83, 200, 255, 0.24);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 12px 22px rgba(0, 0, 0, 0.16);
}

.entrenamiento-recurso-info {
  display: grid;
  gap: 4px;
  min-width: 0;
  flex: 1;
}

.entrenamiento-recurso-cabecera {
  display: block;
  max-width: 100%;
  color: var(--color-text);
  font-weight: 650;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.entrenamiento-recurso-tipo {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-text-muted);
}

.entrenamiento-recurso-acciones {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
  flex-shrink: 0;
}

.entrenamiento-recursos[data-tiene-recursos="false"] {
  padding-top: 2px;
}

.entrenamiento-recurso-vacio {
  padding: 14px 15px;
  border: 1px dashed rgba(83, 200, 255, 0.18);
  border-radius: 16px;
  background:
    linear-gradient(180deg, rgba(3, 14, 21, 0.42), rgba(3, 17, 25, 0.26));
  color: var(--color-text-muted);
}

.sesiones-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 12px;
  align-items: center;
  margin: 16px 0 18px;
  padding: 16px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 20px;
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.08), transparent 30%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.72), rgba(3, 14, 21, 0.58));
  box-shadow:
    0 16px 34px rgba(0, 0, 0, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.sesiones-toolbar {
  grid-template-columns: minmax(220px, 1.35fr) minmax(165px, .8fr) minmax(155px, .75fr) minmax(138px, .62fr) minmax(138px, .62fr) auto auto auto;
  align-items: end;
}
.sesiones-toolbar select,
.sesiones-toolbar input[type="date"] {
  width: 100%;
  min-height: 46px;
  border: 1px solid rgba(83, 200, 255, .16);
  border-radius: 14px;
  background: rgba(3, 14, 21, .7);
  color: var(--color-text);
  padding: 0 12px;
}
.sesiones-filtro-resumen {
  grid-column: 1 / -1;
  color: #8ef0cf;
  font-size: 12px;
  font-weight: 800;
}
@media (max-width: 1320px) {
  .sesiones-toolbar { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .sesiones-toolbar input[type="search"] { grid-column: span 2; }
}
.sesiones-toolbar::before {
  content: "Filtro de sesiones";
  grid-column: 1 / -1;
  color: #a7d9eb;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 2px;
}

.sesiones-toolbar input[type="search"] {
  min-width: 0;
}

.sesiones-toolbar .btn-pro {
  white-space: nowrap;
}

.sesion-form-card,
.sesion-seccion,
.sesiones-hero-premium-card,
.sesiones-resumen-premium-card {
  backdrop-filter: blur(10px);
}

@media (max-width: 900px) {
  .sesiones-toolbar {
    grid-template-columns: 1fr;
  }

  .sesion-form-layout {
    gap: 18px;
  }

  .sesiones-hero-premium,
  .sesiones-resumen-premium,
  .panel-resumen-premium {
    grid-template-columns: 1fr;
  }

  .entrenamiento-proxima-sesion-cabecera {
    flex-direction: column;
  }

  .entrenamiento-proxima-sesion {
    padding: 16px;
  }

  .entrenamiento-bloque-cabecera {
    flex-direction: column;
    align-items: flex-start;
  }

  .entrenamiento-recurso {
    align-items: flex-start;
    flex-direction: column;
  }

  .entrenamiento-recurso-acciones {
    width: 100%;
    justify-content: flex-start;
  }

  .sesion-tab-pane {
    padding: 15px;
  }

  .sesion-bloque-recursos,
  .sesion-recurso-form {
    padding: 14px;
  }

  .sesion-media-toolbar {
    grid-template-columns: 1fr;
  }

  .sesion-media-toolbar .sesion-media-campo,
  .sesion-media-toolbar .btn-pro,
  .sesion-recurso-form .btn-pro {
    grid-column: 1 / -1;
  }

  .entrenamiento-vista-lista {
    grid-template-columns: 1fr;
  }

  .entrenamiento-detalle-cabecera {
    flex-direction: column;
    align-items: flex-start;
  }
}

.sesion-recurso-acciones {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.sesion-recurso-composer {
  display: grid;
  gap: 10px;
  padding: 14px;
  margin-top: 8px;
  border: 1px solid rgba(55, 230, 161, 0.16);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.08), transparent 28%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.72), rgba(3, 14, 21, 0.56));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 12px 24px rgba(0, 0, 0, 0.14);
}

.sesion-recurso-composer-encabezado {
  display: grid;
  gap: 4px;
}

.sesion-recurso-composer-encabezado strong {
  color: #d8f7ff;
  font-size: 14px;
  letter-spacing: 0.02em;
}

.sesion-recurso-composer-encabezado span {
  color: var(--color-text-muted);
  font-size: 12px;
  line-height: 1.45;
}

.sesion-recurso-composer .sesion-media-campo {
  grid-column: 1 / -1;
}

.sesion-recurso-composer-acciones {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.sesion-extras {
  display: grid;
  gap: 6px;
  margin-top: 8px;
}

.sesion-extras-resumen,
.sesion-extras-recursos {
  font-size: 13px;
  color: var(--color-text-muted);
}

/* ===========================
   EQUIPO CARD PRO
=========================== */

.equipo-card-pro {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  padding: 18px 20px;
  border-radius: 14px;
  margin-bottom: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  backdrop-filter: blur(8px);
  transition: 0.25s ease;
}

.equipo-card-pro:hover {
  background: rgba(0, 200, 83, 0.18);
  border-color: rgba(0, 200, 83, 0.45);
  transform: translateY(-3px);
  box-shadow: 0 6px 18px rgba(0, 255, 136, 0.25);
}

@media (max-width: 900px) {
  .sesion-recurso-form {
    grid-template-columns: 1fr;
  }
}

.equipo-card-header {
  display: flex;
  align-items: center;
  gap: 12px;
}

.equipo-icono {
  width: 28px;
  height: 28px;
  fill: #00ff88;
}

.equipo-nombre {
  font-size: 20px;
  font-weight: 600;
  color: #e0e0e0;
}

.equipo-card-acciones {
  display: flex;
  gap: 10px;
}

.btn-equipo-pro {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  padding: 8px;
  border-radius: 10px;
  cursor: pointer;
  transition: 0.25s ease;
}

.btn-equipo-pro svg {
  width: 22px;
  height: 22px;
  fill: #d0d0d0;
}

.btn-equipo-pro:hover {
  background: rgba(0, 255, 136, 0.25);
  border-color: rgba(0, 255, 136, 0.45);
}

.btn-equipo-pro:hover svg {
  fill: #00ff88;
}

/* ===========================
   TRANSICIONES GLOBALES — UX PRO
=========================== */

* {
  transition:
    background-color 0.22s ease,
    color 0.22s ease,
    border-color 0.22s ease,
    box-shadow 0.22s ease,
    transform 0.18s ease;
}

button,
input,
select,
.panel,
.item-equipo,
.tarjetaJugadora,
#sidebar div,
.menu-item {
  transition:
    background 0.22s ease,
    color 0.22s ease,
    border-color 0.22s ease,
    box-shadow 0.22s ease,
    transform 0.18s ease,
    filter 0.22s ease;
}

/* ===========================
   VALIDACIÓN VISUAL PRO
=========================== */

.input-error {
  border-color: #ff6b6b !important;
  box-shadow: 0 0 8px rgba(255, 107, 107, 0.45);
}

.input-ok {
  border-color: #7dff7d !important;
  box-shadow: 0 0 8px rgba(125, 255, 125, 0.45);
}

.label-error {
  color: #ff6b6b !important;
}

.label-ok {
  color: #7dff7d !important;
}

/* Mensaje de error */
.error-msg {
  margin-top: 4px;
  font-size: 13px;
  color: #ff6b6b;
  display: none;
}

.error-msg.visible {
  display: block;
}

/* ===========================
   BOTÓN GUARDAR — ANIMACIÓN PRO
=========================== */

.btn-guardar-pro {
  position: relative;
  overflow: hidden;
  transition:
    transform 0.25s ease,
    background 0.25s ease;
}

/* Vibración si hay error */
.btn-error-shake {
  animation: shake 0.3s ease;
}

@keyframes shake {
  0% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-4px);
  }
  50% {
    transform: translateX(4px);
  }
  75% {
    transform: translateX(-4px);
  }
  100% {
    transform: translateX(0);
  }
}

/* Spinner */
.btn-guardar-pro.loading {
  pointer-events: none;
  opacity: 0.8;
}

.btn-guardar-pro.loading::after {
  content: "";
  position: absolute;
  right: 14px;
  top: 50%;
  width: 18px;
  height: 18px;
  border: 3px solid #fff;
  border-top-color: transparent;
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
  transform: translateY(-50%);
}

@keyframes spin {
  to {
    transform: translateY(-50%) rotate(360deg);
  }
}

/* Éxito */
.btn-guardar-pro.success {
  background: #7dff7d !important;
  color: #000 !important;
}

.btn-guardar-pro.success::after {
  content: "✔";
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  font-weight: bold;
}

/* ===========================
   PREVIEW FOTO — ANIMACIÓN PRO
=========================== */

.preview-foto {
  transition:
    transform 0.35s ease,
    box-shadow 0.35s ease,
    opacity 0.35s ease;
  opacity: 0.85;
}

/* Cuando cambia la foto → animación */
.preview-foto.cambiando {
  transform: scale(1.08);
  opacity: 1;
  box-shadow:
    0 0 18px rgba(0, 200, 255, 0.55),
    inset 0 0 12px rgba(255, 255, 255, 0.25);
}

/* Glow según posición */
.preview-foto.colocadora {
  box-shadow: 0 0 12px rgba(0, 200, 255, 0.45);
}

.preview-foto.receptora {
  box-shadow: 0 0 12px rgba(255, 221, 85, 0.45);
}

.preview-foto.opuesta {
  box-shadow: 0 0 12px rgba(255, 107, 107, 0.45);
}

.preview-foto.central {
  box-shadow: 0 0 12px rgba(125, 255, 125, 0.45);
}

.preview-foto.líbero {
  box-shadow: 0 0 12px rgba(179, 136, 255, 0.45);
}

/* ===========================
   PREVIEW FOTO — HOVER PRO
=========================== */

.preview-foto:hover {
  transform: scale(1.12);
  box-shadow:
    0 0 22px rgba(0, 200, 255, 0.65),
    inset 0 0 14px rgba(255, 255, 255, 0.25);
  opacity: 1;
  transition:
    transform 0.35s ease,
    box-shadow 0.35s ease,
    opacity 0.35s ease;
}

/* Hover según posición */
.preview-foto.colocadora:hover {
  box-shadow:
    0 0 22px rgba(0, 200, 255, 0.65),
    inset 0 0 14px rgba(255, 255, 255, 0.25);
}

.preview-foto.receptora:hover {
  box-shadow:
    0 0 22px rgba(255, 221, 85, 0.65),
    inset 0 0 14px rgba(255, 255, 255, 0.25);
}

.preview-foto.opuesta:hover {
  box-shadow:
    0 0 22px rgba(255, 107, 107, 0.65),
    inset 0 0 14px rgba(255, 255, 255, 0.25);
}

.preview-foto.central:hover {
  box-shadow:
    0 0 22px rgba(125, 255, 125, 0.65),
    inset 0 0 14px rgba(255, 255, 255, 0.25);
}

.preview-foto.líbero:hover {
  box-shadow:
    0 0 22px rgba(179, 136, 255, 0.65),
    inset 0 0 14px rgba(255, 255, 255, 0.25);
}

/* ===========================
   PREVIEW FOTO — HOVER 3D PRO
=========================== */

.preview-foto {
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
  transform-style: preserve-3d;
  perspective: 800px;
}

/* Reset suave cuando el mouse sale */
.preview-foto.reset-3d {
  transform: rotateX(0deg) rotateY(0deg) scale(1);
}

/* ===========================
   PREVIEW FOTO — HOVER 3D + GLASS + BORDE ANIMADO PRO
=========================== */

.preview-foto {
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    opacity 0.25s ease,
    border 0.25s ease;
  transform-style: preserve-3d;
  perspective: 800px;
  border: 2px solid rgba(255, 255, 255, 0.15);
}

/* ⭐ Hover 3D */
.preview-foto:hover {
  transform: scale(1.12);
}

/* ⭐ Glass reflejo */
.preview-foto:hover::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  background: linear-gradient(
    120deg,
    rgba(255, 255, 255, 0.25) 0%,
    rgba(255, 255, 255, 0.05) 40%,
    rgba(255, 255, 255, 0.25) 100%
  );
  opacity: 0.35;
  border-radius: inherit;
}

/* ⭐ Borde animado */
.preview-foto:hover {
  border-color: rgba(0, 200, 255, 0.55);
  box-shadow:
    0 0 22px rgba(0, 200, 255, 0.65),
    inset 0 0 14px rgba(255, 255, 255, 0.25);
}

/* Glow según posición */
.preview-foto.colocadora:hover {
  border-color: rgba(0, 200, 255, 0.55);
  box-shadow:
    0 0 22px rgba(0, 200, 255, 0.65),
    inset 0 0 14px rgba(255, 255, 255, 0.25);
}

.preview-foto.receptora:hover {
  border-color: rgba(255, 221, 85, 0.55);
  box-shadow:
    0 0 22px rgba(255, 221, 85, 0.65),
    inset 0 0 14px rgba(255, 255, 255, 0.25);
}

.preview-foto.opuesta:hover {
  border-color: rgba(255, 107, 107, 0.55);
  box-shadow:
    0 0 22px rgba(255, 107, 107, 0.65),
    inset 0 0 14px rgba(255, 255, 255, 0.25);
}

.preview-foto.central:hover {
  border-color: rgba(125, 255, 125, 0.55);
  box-shadow:
    0 0 22px rgba(125, 255, 125, 0.65),
    inset 0 0 14px rgba(255, 255, 255, 0.25);
}

.preview-foto.líbero:hover {
  border-color: rgba(179, 136, 255, 0.55);
  box-shadow:
    0 0 22px rgba(179, 136, 255, 0.65),
    inset 0 0 14px rgba(255, 255, 255, 0.25);
}

/* Reset 3D */
.preview-foto.reset-3d {
  transform: rotateX(0deg) rotateY(0deg) scale(1);
}

/* ===========================
   PREVIEW FOTO — BASE
=========================== */

.form-foto {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.preview-foto {
  width: 220px;
  height: 220px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 12px;
  border: 2px solid rgba(255, 255, 255, 0.15);
  position: relative;
  z-index: 10;
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    opacity 0.25s ease,
    border 0.25s ease;
}

/* Animación al cambiar foto */
.preview-foto.cambiando {
  transform: scale(1.08);
  box-shadow: 0 0 18px rgba(0, 200, 255, 0.55);
}

/* Glow por posición */
.preview-foto.colocadora {
  box-shadow: 0 0 12px rgba(0, 200, 255, 0.45);
}
.preview-foto.receptora {
  box-shadow: 0 0 12px rgba(255, 221, 85, 0.45);
}
.preview-foto.opuesta {
  box-shadow: 0 0 12px rgba(255, 107, 107, 0.45);
}
.preview-foto.central {
  box-shadow: 0 0 12px rgba(125, 255, 125, 0.45);
}
.preview-foto.líbero {
  box-shadow: 0 0 12px rgba(179, 136, 255, 0.45);
}

/* Hover 3D + Glass + Borde animado */
.preview-foto:hover {
  transform: scale(1.12);
  border-color: rgba(0, 200, 255, 0.55);
  box-shadow:
    0 0 22px rgba(0, 200, 255, 0.65),
    inset 0 0 14px rgba(255, 255, 255, 0.25);
}

.preview-foto:hover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    120deg,
    rgba(255, 255, 255, 0.25) 0%,
    rgba(255, 255, 255, 0.05) 40%,
    rgba(255, 255, 255, 0.25) 100%
  );
  opacity: 0.35;
  border-radius: inherit;
  pointer-events: none;
}

/* Reset 3D */
.preview-foto.reset-3d {
  transform: rotateX(0deg) rotateY(0deg) scale(1);
}

/* ===========================
   PANEL NUEVA JUGADORA — PRO
=========================== */

#panelNuevaJugadora.panel-form:not(.visible) {
  display: none;
}

#panelNuevaJugadora.panel-form.visible {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

#panelNuevaJugadora > #btnGuardarJugadora {
  position: absolute;
  top: 42px;
  right: 42px;
  margin-top: 0;
}

@media (max-width: 900px) {
  #panelNuevaJugadora > #btnGuardarJugadora {
    position: static;
    align-self: flex-start;
    order: 1;
  }
}

/* GRID CAMPOS + FOTO */
.form-grid {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 24px;
  align-items: flex-start;
}

/* FOTO */
.form-foto {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* PREVIEW FOTO */
.preview-foto {
  width: 220px;
  height: 220px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 12px;
  border: 2px solid rgba(255, 255, 255, 0.15);
  position: relative;
  z-index: 10;
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    opacity 0.25s ease,
    border 0.25s ease;
}

/* Animación al cambiar foto */
.preview-foto.cambiando {
  transform: scale(1.08);
  box-shadow: 0 0 18px rgba(0, 200, 255, 0.55);
}

/* Glow por posición */
.preview-foto.colocadora {
  box-shadow: 0 0 12px rgba(0, 200, 255, 0.45);
}
.preview-foto.receptora {
  box-shadow: 0 0 12px rgba(255, 221, 85, 0.45);
}
.preview-foto.opuesta {
  box-shadow: 0 0 12px rgba(255, 107, 107, 0.45);
}
.preview-foto.central {
  box-shadow: 0 0 12px rgba(125, 255, 125, 0.45);
}
.preview-foto.líbero {
  box-shadow: 0 0 12px rgba(179, 136, 255, 0.45);
}

/* Hover 3D + glass + borde animado */
.preview-foto:hover {
  transform: scale(1.12);
  border-color: rgba(0, 200, 255, 0.55);
  box-shadow:
    0 0 22px rgba(0, 200, 255, 0.65),
    inset 0 0 14px rgba(255, 255, 255, 0.25);
}

.preview-foto:hover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    120deg,
    rgba(255, 255, 255, 0.25) 0%,
    rgba(255, 255, 255, 0.05) 40%,
    rgba(255, 255, 255, 0.25) 100%
  );
  opacity: 0.35;
  border-radius: inherit;
  pointer-events: none;
}

/* Reset 3D */
.preview-foto.reset-3d {
  transform: rotateX(0deg) rotateY(0deg) scale(1);
}

/* CAMPOS */
.form-campos {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 18px;
}

.form-campos label {
  grid-column: span 2;
}

/* BOTÓN GUARDAR PRO */
.btn-guardar-pro {
  margin-top: 16px;
  align-self: flex-end;
  padding: 10px 22px;
  border-radius: 999px;
  border: none;
  cursor: pointer;
  font-weight: 600;
  background: linear-gradient(135deg, #00c8ff, #007bff);
  color: #fff;
  box-shadow: 0 0 14px rgba(0, 200, 255, 0.55);
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    opacity 0.2s ease;
}

.btn-guardar-pro:hover {
  transform: translateY(-1px);
  box-shadow: 0 0 18px rgba(0, 200, 255, 0.75);
}

.btn-guardar-pro:active {
  transform: translateY(1px) scale(0.98);
}

/* Estado cargando / éxito */
.btn-guardar-pro.cargando {
  opacity: 0.8;
  pointer-events: none;
}

.btn-guardar-pro.exito {
  background: linear-gradient(135deg, #4caf50, #2e7d32);
  box-shadow: 0 0 18px rgba(76, 175, 80, 0.75);
}

/* Mensajes de error */
.error-msg {
  display: none;
  font-size: 0.8rem;
  color: #ff6b6b;
}

.error-msg.visible {
  display: block;
}

.input-error {
  border-color: #ff6b6b !important;
}

.input-ok {
  border-color: #4caf50 !important;
}

.label-error {
  color: #ff6b6b;
}

.label-ok {
  color: #4caf50;
}
/* ========================================================================== */
/* VISUAL REFRESH — BASE DEL SISTEMA                                           */
/* ========================================================================== */

:root {
  --color-bg-deep: #061019;
  --color-surface: rgba(7, 21, 30, 0.88);
  --color-surface-raised: rgba(11, 30, 41, 0.94);
  --color-surface-soft: rgba(255, 255, 255, 0.042);
  --color-border: rgba(196, 230, 239, 0.11);
  --color-border-strong: rgba(55, 230, 161, 0.28);
  --color-text: #f4f9fb;
  --color-text-muted: #96abb4;
  --color-primary: #30d89a;
  --color-primary-strong: #1fb97d;
  --color-accent: #67bff0;
  --color-warning: #ffc857;
  --color-danger: #ff6b7a;
  --sidebar-width: 272px;
  --panel-gap: 20px;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 22px;
  --shadow-panel: 0 22px 58px rgba(0, 0, 0, 0.36);
  --shadow-card: 0 12px 28px rgba(0, 0, 0, 0.2);
  --transition-fast: 160ms ease;
  --transition-base: 240ms ease;
}

* {
  box-sizing: border-box;
}

html {
  background-color: var(--color-bg-deep);
}

body {
  font-family:
    Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
    sans-serif;
  color: var(--color-text);
  background:
    linear-gradient(120deg, rgba(3, 13, 21, 0.96), rgba(4, 21, 29, 0.74)),
    url("assets/img/fondo_pista.jpg") center / cover no-repeat !important;
  letter-spacing: -0.01em;
}

body::before {
  position: fixed;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(circle at 78% 14%, rgba(103, 191, 240, 0.06), transparent 30%),
    radial-gradient(circle at 35% 88%, rgba(48, 216, 154, 0.05), transparent 34%);
  content: "";
  pointer-events: none;
}

button,
input,
select {
  font: inherit;
}

button:focus-visible,
input:focus-visible,
select:focus-visible,
.menu-item:focus-visible {
  outline: 3px solid rgba(103, 191, 240, 0.42);
  outline-offset: 2px;
}

#sidebar {
  width: var(--sidebar-width);
  padding: 34px 18px 24px;
  gap: 14px;
  background:
    linear-gradient(180deg, rgba(6, 18, 26, 0.98), rgba(4, 13, 20, 0.96));
  border-right-color: var(--color-border);
  box-shadow: 14px 0 42px rgba(0, 0, 0, 0.3);
}

.logo {
  position: relative;
  display: block;
  margin: 0 4px 18px;
  padding: 18px 16px 14px;
  overflow: visible;
  border: 1px solid rgba(103, 191, 240, 0.16);
  border-radius: 20px;
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.16), transparent 42%),
    linear-gradient(180deg, rgba(10, 26, 36, 0.82), rgba(4, 13, 20, 0.12));
  box-shadow:
    0 14px 32px rgba(0, 0, 0, 0.28),
    inset 0 0 0 1px rgba(255, 255, 255, 0.02);
  color: var(--color-text);
  font-size: 24px;
  font-weight: 950;
  letter-spacing: -0.05em;
  line-height: 1.08;
  text-transform: uppercase;
  text-shadow:
    0 1px 0 rgba(0, 0, 0, 0.28),
    0 3px 0 rgba(0, 0, 0, 0.18),
    0 10px 28px rgba(0, 0, 0, 0.42);
}

.logo::after {
  display: block;
  width: 100%;
  height: 3px;
  margin-top: 10px;
  border-radius: 999px;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.12), transparent 10%, transparent 90%, rgba(255, 255, 255, 0.12)),
    linear-gradient(90deg, var(--color-primary), rgba(103, 191, 240, 0.84));
  box-shadow:
    0 0 18px rgba(55, 230, 161, 0.18),
    0 0 16px rgba(103, 191, 240, 0.12);
  content: "";
}

.menu-item {
  min-height: 52px;
  padding: 13px 14px;
  gap: 13px;
  border-color: transparent;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  font-size: 15px;
  font-weight: 620;
  letter-spacing: 0;
}

.menu-item svg {
  width: 21px;
  height: 21px;
  fill: currentColor;
}

.menu-item:hover {
  transform: translateX(3px);
  border-color: var(--color-border);
  background: var(--color-surface-soft);
  color: #f8fcfd;
  box-shadow: none;
}

.menu-item:hover svg,
.menu-item.activo svg {
  fill: currentColor;
}

.menu-item.activo {
  transform: none;
  border: 1px solid var(--color-border-strong);
  border-left: 1px solid var(--color-border-strong);
  background: linear-gradient(110deg, rgba(48, 216, 154, 0.14), rgba(103, 191, 240, 0.06));
  color: #8cefd0;
  box-shadow: inset 3px 0 0 var(--color-primary);
}

#sidebar div.activo {
  animation: none;
}

#contenido {
  margin-left: var(--sidebar-width) !important;
}

.panel {
  top: var(--panel-gap);
  right: var(--panel-gap);
  bottom: var(--panel-gap);
  left: calc(var(--sidebar-width) + var(--panel-gap));
  max-height: none;
  padding: clamp(24px, 3vw, 42px);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background:
    linear-gradient(145deg, rgba(10, 28, 38, 0.9), rgba(5, 17, 25, 0.82));
  box-shadow: var(--shadow-panel);
  backdrop-filter: blur(24px) saturate(120%);
  scrollbar-color: rgba(169, 189, 198, 0.38) transparent;
  scrollbar-width: thin;
}

.panel::before {
  position: absolute;
  top: 0;
  right: 28px;
  left: 28px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(103, 191, 240, 0.36), transparent);
  content: "";
}

.panel > h2,
.dashboard-title {
  margin: 0 0 30px;
  color: var(--color-text);
  font-size: clamp(28px, 3vw, 42px);
  font-weight: 780;
  letter-spacing: -0.045em;
  line-height: 1.05;
}

.panel > h2::after,
.dashboard-title::after {
  display: block;
  width: 58px;
  height: 4px;
  margin-top: 14px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--color-primary), var(--color-accent));
  content: "";
}

.panel h3 {
  color: var(--color-text);
  font-weight: 700;
  letter-spacing: -0.02em;
}

.bloque {
  padding: 22px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  box-shadow: var(--shadow-card);
}

.bloque:hover {
  transform: translateY(-1px);
  border-color: rgba(196, 230, 239, 0.22);
  background: var(--color-surface-raised);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.3);
}

.bloque input,
.bloque select,
.accionesJugadoras input,
.accionesJugadoras select,
.form-campos input,
.form-campos select,
.modal-contenido input {
  min-height: 46px;
  padding: 11px 13px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: rgba(3, 14, 21, 0.68);
  color: var(--color-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
  transition:
    border-color var(--transition-fast),
    box-shadow var(--transition-fast),
    background var(--transition-fast);
}

.bloque input:hover,
.bloque select:hover,
.accionesJugadoras input:hover,
.accionesJugadoras select:hover,
.form-campos input:hover,
.form-campos select:hover {
  border-color: rgba(83, 200, 255, 0.38);
}

.bloque input:focus,
.bloque select:focus,
.accionesJugadoras input:focus,
.accionesJugadoras select:focus,
.form-campos input:focus,
.form-campos select:focus,
.modal-contenido input:focus {
  border-color: var(--color-accent);
  outline: none;
  background: rgba(5, 22, 31, 0.92);
  box-shadow: 0 0 0 4px rgba(83, 200, 255, 0.12);
}

::placeholder {
  color: #78909b;
  opacity: 1;
}

.btn-pro,
.btn-guardar-pro {
  min-height: 44px;
  padding: 11px 18px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: var(--radius-sm);
  background: linear-gradient(135deg, var(--color-accent), #35aee8);
  color: #04141d;
  font-size: 14px;
  font-weight: 760;
  letter-spacing: 0.01em;
  box-shadow: 0 9px 22px rgba(24, 140, 190, 0.2);
  transition:
    transform var(--transition-fast),
    filter var(--transition-fast),
    box-shadow var(--transition-fast);
}

.btn-pro:hover,
.btn-guardar-pro:hover {
  transform: translateY(-1px);
  filter: brightness(1.08);
  box-shadow: 0 12px 28px rgba(24, 140, 190, 0.3);
}

.btn-crear {
  background: linear-gradient(135deg, var(--color-primary), var(--color-primary-strong));
  box-shadow: 0 9px 22px rgba(32, 201, 133, 0.2);
}

.btn-guardar {
  background: linear-gradient(135deg, var(--color-warning), #e8aa32);
}

.tabs-equipos {
  padding: 5px;
  border: 1px solid var(--color-border);
  border-radius: 13px;
  background: rgba(3, 14, 21, 0.42);
}

.tab-equipo {
  border-radius: 9px;
  color: var(--color-text-muted);
  font-weight: 650;
}

.accionesJugadoras {
  align-items: center;
  gap: 12px;
  margin: 18px 0 10px;
  padding: 14px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: rgba(6, 20, 29, 0.58);
}

.equipo-card,
.jugadora-card,
.item-lista,
.item-asistencia,
.dashboard-card,
.dashboard-chart-card {
  border-color: var(--color-border);
  box-shadow: var(--shadow-card);
}

.equipo-card:hover,
.jugadora-card:hover,
.dashboard-card:hover,
.dashboard-chart-card:hover {
  border-color: rgba(55, 230, 161, 0.28);
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.32);
}

@media (max-width: 1050px) {
  :root {
    --sidebar-width: 224px;
    --panel-gap: 14px;
  }

  #sidebar {
    padding-inline: 13px;
  }

  .logo {
    font-size: 19px;
  }

  .menu-item {
    min-height: 48px;
    padding-inline: 12px;
    font-size: 14px;
  }

  .panel {
    padding: 24px;
  }

  .listaJugadoras {
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ========================================================================== */
/* VISUAL REFRESH — COMPONENTES Y ESTADOS                                      */
/* ========================================================================== */

/* Estado activo de la navegación sin acoplarlo a JavaScript. */
body:has(#panelEquipos.visible) #btnPanelEquipos,
body:has(#panelJugadoras.visible) #btnPanelJugadoras,
body:has(#panelNuevaJugadora.visible) #btnPanelJugadoras,
body:has(#panelSesiones.visible) #btnPanelSesiones,
body:has(#panelCrearSesion.visible) #btnPanelSesiones,
body:has(#panelSesionesPendientes.visible) #btnPanelSesiones,
body:has(#panelSesionesFinalizadas.visible) #btnPanelSesiones,
body:has(#panelEntrenamiento.visible) #btnPanelEntrenamiento,
body:has(#panelPizarra.visible) #btnPanelPizarra,
body:has(#panelUsuarios.visible) #btnPanelUsuarios,
body:has(#panelLista.visible) #btnPanelLista,
body:has(#panelEstadisticas.visible) #btnPanelEstadisticas,
body:has(#panelDashboard.visible) #btnPanelDashboard,
.menu-item.activo {
  border-color: var(--color-border-strong);
  background: linear-gradient(110deg, rgba(55, 230, 161, 0.17), rgba(83, 200, 255, 0.07));
  color: var(--color-primary);
  box-shadow: inset 3px 0 0 var(--color-primary);
}

/* Acciones coherentes en equipos, jugadoras, sesiones y asistencia. */
.equipo-btn,
.btn-accion {
  display: inline-flex;
  flex: 0 0 40px;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 11px;
  cursor: pointer;
  backdrop-filter: none;
  box-shadow: 0 7px 18px rgba(0, 0, 0, 0.2);
  transition:
    transform var(--transition-fast),
    border-color var(--transition-fast),
    background var(--transition-fast),
    box-shadow var(--transition-fast);
}

.equipo-btn svg,
.btn-accion svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

.equipo-btn.editar,
.btn-accion.btn-editar {
  border-color: rgba(83, 200, 255, 0.38);
  background: rgba(83, 200, 255, 0.13);
  color: #78d7ff;
}

.equipo-btn.editar:hover,
.btn-accion.btn-editar:hover {
  transform: translateY(-2px);
  border-color: rgba(83, 200, 255, 0.72);
  background: rgba(83, 200, 255, 0.24);
  box-shadow: 0 10px 24px rgba(40, 160, 211, 0.2);
}

.equipo-btn.duplicar,
.btn-accion.btn-duplicar {
  border-color: rgba(93, 233, 181, 0.36);
  background: rgba(93, 233, 181, 0.12);
  color: #77f1bd;
}

.equipo-btn.duplicar:hover,
.btn-accion.btn-duplicar:hover {
  transform: translateY(-2px);
  border-color: rgba(93, 233, 181, 0.68);
  background: rgba(93, 233, 181, 0.22);
  box-shadow: 0 10px 24px rgba(47, 189, 126, 0.2);
}

.btn-accion.btn-favorita {
  border-color: rgba(255, 211, 90, 0.35);
  background: rgba(255, 211, 90, 0.12);
  color: #ffd65a;
}

.btn-accion.btn-favorita.activa {
  border-color: rgba(255, 211, 90, 0.72);
  background: rgba(255, 211, 90, 0.22);
  box-shadow: 0 10px 24px rgba(161, 127, 14, 0.18);
}

.btn-accion.btn-favorita:hover {
  transform: translateY(-2px);
  border-color: rgba(255, 211, 90, 0.72);
  background: rgba(255, 211, 90, 0.22);
}

.equipo-btn.eliminar,
.btn-accion.btn-eliminar {
  border-color: rgba(255, 107, 122, 0.4);
  background: rgba(255, 107, 122, 0.12);
  color: #ff8995;
}

.equipo-btn.eliminar:hover,
.btn-accion.btn-eliminar:hover {
  transform: translateY(-2px);
  border-color: rgba(255, 107, 122, 0.74);
  background: rgba(255, 107, 122, 0.23);
  box-shadow: 0 10px 24px rgba(221, 67, 83, 0.2);
}

.equipo-btn:active,
.btn-accion:active {
  transform: translateY(0) scale(0.96);
}

/* Tarjetas de jugadoras: jerarquía limpia y acciones siempre dentro. */
.listaJugadoras {
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
  gap: 18px;
  padding: 16px 0 24px;
}

.jugadora-card {
  --position-color: var(--color-accent);
  position: relative;
  min-width: 0;
  min-height: 148px;
  margin: 0;
  padding: 20px;
  gap: 16px;
  overflow: hidden;
  border: 1px solid rgba(55, 230, 161, 0.12);
  border-left: 3px solid var(--position-color);
  border-radius: var(--radius-md);
  background:
    radial-gradient(circle at top right, rgba(83, 200, 255, 0.08), transparent 34%),
    linear-gradient(145deg, rgba(9, 27, 37, 0.92), rgba(5, 19, 27, 0.88));
  box-shadow:
    0 14px 32px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03) !important;
}

.jugadora-card.colocadora {
  --position-color: #37e6a1;
}

.jugadora-card.receptora {
  --position-color: #53c8ff;
}

.jugadora-card.opuesta {
  --position-color: #ff7a88;
}

.jugadora-card.central {
  --position-color: #ffc857;
}

.jugadora-card.líbero {
  --position-color: #b99cff;
}

.jugadora-card:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--position-color) 42%, transparent);
  border-left-color: var(--position-color);
  background: linear-gradient(145deg, rgba(13, 36, 48, 0.96), rgba(7, 23, 32, 0.92));
  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.3),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03) !important;
}

.jugadora-foto {
  width: 76px;
  height: 76px;
  border: 2px solid var(--position-color) !important;
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--position-color) 10%, transparent) !important;
}

.jugadora-card:hover .jugadora-foto {
  transform: scale(1.03);
  box-shadow: 0 0 0 6px color-mix(in srgb, var(--position-color) 13%, transparent) !important;
}

.jugadora-info {
  min-width: 0;
}

.jugadora-nombre {
  overflow-wrap: anywhere;
  color: var(--color-text);
  font-size: 19px;
  line-height: 1.25;
}

.jugadora-detalles {
  flex-wrap: wrap;
  gap: 4px 10px;
  color: var(--color-text-muted);
  line-height: 1.45;
}

.jugadora-detalles span:first-child {
  color: var(--position-color);
  font-weight: 700;
  text-transform: capitalize;
}

.jugadora-acciones,
.equipo-card-acciones,
.acciones {
  flex: 0 0 auto;
  gap: 9px;
}

.jugadora-acciones {
  flex-direction: column;
}

.jugadora-equipo {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  margin-top: 7px;
  padding: 3px 8px;
  overflow: hidden;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.045);
  color: var(--color-text-muted);
  font-size: 11px;
  font-weight: 720;
  letter-spacing: 0.045em;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

/* Controles de búsqueda y filtros. */
.accionesJugadoras {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(160px, 210px) auto;
}

.accionesJugadoras input,
.accionesJugadoras select {
  width: 100%;
  margin: 0;
}

.accionesJugadoras .btn-pro {
  white-space: nowrap;
}

.tab-equipo {
  padding: 11px 16px;
  border-color: transparent;
  background: transparent;
  transition:
    color var(--transition-fast),
    border-color var(--transition-fast),
    background var(--transition-fast);
}

.tab-equipo:hover {
  border-color: var(--color-border);
  background: rgba(255, 255, 255, 0.05);
}

.tab-equipo.activa {
  border-color: rgba(83, 200, 255, 0.4);
  background: rgba(83, 200, 255, 0.16);
  color: #79d9ff;
  box-shadow: inset 0 0 0 1px rgba(83, 200, 255, 0.05);
}

/* Equipos y listas. */
.listaEquipos,
.listaSesiones {
  gap: 14px;
  padding-inline: 0;
}

.equipo-card,
.item-lista,
.item-asistencia {
  border-radius: var(--radius-md);
  background: linear-gradient(145deg, rgba(9, 27, 37, 0.88), rgba(5, 19, 27, 0.84));
}

.equipo-card {
  margin-bottom: 0;
  padding: 18px 20px;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(55, 230, 161, 0.12);
  background:
    radial-gradient(circle at top right, rgba(83, 200, 255, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.9), rgba(3, 14, 21, 0.7));
  box-shadow:
    0 14px 32px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    border-color 0.25s ease;
}

.equipo-card:hover {
  transform: translateY(-3px);
  border-color: rgba(55, 230, 161, 0.24);
  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.3),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.equipo-card::after,
.jugadora-card::after {
  content: "";
  position: absolute;
  inset: auto -18px -18px auto;
  width: 84px;
  height: 84px;
  border-radius: 28px;
  background: radial-gradient(circle, rgba(55, 230, 161, 0.14), transparent 68%);
  filter: blur(12px);
  pointer-events: none;
}

#listaEquipos {
  display: grid;
  gap: 12px;
  padding-bottom: 18px;
}

.equipo-card-nombre {
  color: #78d7ff;
  font-size: 20px;
  letter-spacing: -0.02em;
}

.equipo-card-stats {
  color: var(--color-text-muted);
  font-size: 13px;
}

/* Calendario integrado con el resto de superficies. */
#calendarioGrande {
  width: min(100%, 520px);
  padding: 18px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: rgba(3, 14, 21, 0.58);
  color: var(--color-text);
}

.cal-header {
  margin-bottom: 16px;
  font-weight: 720;
  text-transform: capitalize;
}

.cal-header button {
  width: 38px;
  height: 38px;
  padding: 0;
  border: 1px solid rgba(83, 200, 255, 0.35);
  border-radius: 10px;
  background: rgba(83, 200, 255, 0.14);
  color: #79d9ff;
}

.cal-grid {
  gap: 7px;
}

.cal-day {
  display: grid;
  min-height: 42px;
  padding: 0;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.045);
  color: var(--color-text-muted);
}

.cal-day:hover {
  border-color: rgba(83, 200, 255, 0.35);
  background: rgba(83, 200, 255, 0.13);
  color: var(--color-text);
}

.cal-day.selected {
  border-color: rgba(55, 230, 161, 0.55);
  background: rgba(55, 230, 161, 0.2);
  color: var(--color-primary);
}

.input-hora-grande {
  border-color: var(--color-border);
  background: rgba(3, 14, 21, 0.68);
}

@media (max-width: 1280px) {
  .listaJugadoras {
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  }

  .jugadora-card {
    align-items: flex-start;
  }

  .jugadora-acciones {
    flex-direction: column;
  }
}

@media (max-width: 820px) {
  .accionesJugadoras {
    grid-template-columns: 1fr;
  }

  .jugadora-card {
    flex-wrap: wrap;
  }

  .jugadora-acciones {
    width: 100%;
    flex-direction: row;
    justify-content: flex-end;
  }
}

/* ========================================================================== */
/* PANEL DE SESIONES                                                           */
/* ========================================================================== */

.sesion-form-card > h3 {
  margin: 0 0 22px;
}

.sesion-form-card {
  position: relative;
  overflow: hidden;
  padding: 24px;
  border: 1px solid rgba(55, 230, 161, 0.12);
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.08), transparent 30%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.88), rgba(3, 14, 21, 0.7));
  box-shadow:
    0 18px 42px rgba(0, 0, 0, 0.28),
    inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}

.sesion-form-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    linear-gradient(120deg, rgba(55, 230, 161, 0.06), transparent 24%, transparent 76%, rgba(83, 200, 255, 0.04));
  opacity: 0.8;
}

.sesion-form-card > * {
  position: relative;
  z-index: 1;
}

.sesion-form-layout {
  display: grid;
  grid-template-columns: minmax(300px, 1fr) minmax(420px, 520px);
  gap: clamp(24px, 3.4vw, 54px);
  align-items: start;
}

.sesion-bloque-recursos {
  margin-top: 16px;
  padding: 16px;
  border: 1px solid rgba(83, 200, 255, 0.1);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.04), transparent 44%),
    linear-gradient(180deg, rgba(3, 14, 21, 0.54), rgba(3, 17, 25, 0.42));
}

.sesion-media-toolbar {
  margin-top: 14px;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid rgba(83, 200, 255, 0.08);
  background: rgba(3, 14, 21, 0.52);
  gap: 12px;
}

.sesion-media-toolbar .btn-pro {
  min-height: 42px;
}

.sesion-tab-pane > label {
  display: inline-block;
  margin-top: 2px;
  margin-bottom: 8px;
  color: var(--color-text-muted);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sesion-duracion-input {
  display: flex;
  align-items: center;
  min-height: 46px;
  margin: 0 0 7px;
  padding: 0 16px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: rgba(3, 17, 25, 0.78);
  transition:
    border-color var(--transition-fast),
    box-shadow var(--transition-fast);
}

.sesion-campos .sesion-duracion-input input {
  flex: 0 1 auto;
  width: auto;
  min-width: 2ch;
  max-width: 5ch;
  min-height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  appearance: textfield;
  field-sizing: content;
}

.sesion-duracion-input span {
  margin-left: 5px;
  color: var(--color-text-muted);
  font-size: 14px;
  pointer-events: none;
}

.sesion-duracion-input:focus-within {
  border-color: var(--color-accent);
  box-shadow: 0 0 0 4px rgba(83, 200, 255, 0.12);
}

.sesion-campos .sesion-duracion-input input:focus {
  outline: none;
  box-shadow: none;
}

.sesion-campos .sesion-duracion-input input::-webkit-inner-spin-button,
.sesion-campos .sesion-duracion-input input::-webkit-outer-spin-button {
  margin: 0;
  appearance: none;
}

.sesion-campos {
  display: grid;
  gap: 9px;
}

.sesion-campos label {
  margin-top: 5px;
  color: var(--color-text-muted);
  font-size: 13px;
  font-weight: 700;
}

.sesion-campos input,
.sesion-campos select {
  width: 100%;
  margin: 0 0 7px;
}

.sesion-campos .input-hora-grande {
  width: 100%;
  min-height: 46px;
  padding: 11px 13px;
  font-size: 15px;
}

.sesion-campos .btn-pro {
  width: fit-content;
  margin-top: 8px;
}

.sesion-calendario > h3 {
  margin: 3px 0 15px;
  font-size: 17px;
}

.sesion-calendario #calendarioGrande {
  width: 100%;
}

.sesion-seccion {
  position: relative;
  padding: 20px 20px 18px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 20px;
  background:
    radial-gradient(circle at top right, rgba(83, 200, 255, 0.08), transparent 28%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.58), rgba(3, 14, 21, 0.72));
}

.sesion-seccion > * {
  position: relative;
  z-index: 1;
}

.sesion-tabs {
  position: sticky;
  top: 12px;
  z-index: 2;
  backdrop-filter: blur(14px);
  padding: 10px 0 12px;
  background: linear-gradient(180deg, rgba(3, 14, 21, 0.82), rgba(3, 14, 21, 0.32));
}

.sesion-tab {
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.sesion-tab-pane {
  animation: sesionPaneIn 180ms ease;
}

@keyframes sesionPaneIn {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

#listaSesiones {
  display: grid;
  gap: 12px;
  margin-top: 14px;
  padding-bottom: 22px;
}

#listaSesiones .item-lista {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  min-height: 104px;
  padding: 20px 22px;
  border: 1px solid rgba(55, 230, 161, 0.12);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.9), rgba(3, 14, 21, 0.68));
  box-shadow:
    0 14px 32px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
  transition:
    transform var(--transition-fast),
    border-color var(--transition-fast),
    box-shadow var(--transition-fast);
}

#listaSesiones .item-lista:hover {
  transform: translateY(-2px);
  border-color: rgba(55, 230, 161, 0.24);
  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.3),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.sesion-info {
  min-width: 0;
  flex: 1;
}

.sesion-nombre {
  overflow: hidden;
  color: var(--color-text);
  font-size: 18px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sesion-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 8px;
}

.sesion-meta span {
  display: inline-flex;
  align-items: center;
  min-height: 25px;
  padding: 3px 9px;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.04);
  color: var(--color-text-muted);
  font-size: 12px;
  font-weight: 650;
}

.lista-estado-entrenamiento {
  display: grid;
  gap: 14px;
  margin-bottom: 18px;
  padding: 18px 20px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(83, 200, 255, 0.1), transparent 36%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.88), rgba(3, 14, 21, 0.68));
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.3),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.lista-estado-entrenamiento[data-tono="alto"] {
  border-color: rgba(55, 230, 161, 0.22);
}

.lista-estado-entrenamiento[data-tono="medio"] {
  border-color: rgba(83, 200, 255, 0.18);
}

.lista-estado-entrenamiento[data-tono="bajo"] {
  border-color: rgba(255, 190, 70, 0.2);
}

.lista-estado-entrenamiento-cabecera {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.lista-estado-entrenamiento-etiqueta {
  display: inline-flex;
  width: fit-content;
  margin-bottom: 6px;
  padding: 5px 9px;
  border-radius: 999px;
  background: rgba(55, 230, 161, 0.12);
  color: var(--color-primary);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.lista-estado-entrenamiento h3 {
  margin: 0;
  font-size: 20px;
}

.lista-estado-entrenamiento p {
  margin: 6px 0 0;
  color: var(--color-text-muted);
}

.lista-estado-entrenamiento-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 96px;
  min-height: 38px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(83, 200, 255, 0.12);
  color: #78d7ff;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.03em;
}

.lista-estado-entrenamiento-metrica {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.lista-estado-entrenamiento-metrica span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 999px;
  background: rgba(3, 17, 25, 0.62);
  color: var(--color-text);
  font-size: 12px;
  font-weight: 650;
}

#panelDashboard #dashboardResumenPremium {
  margin-top: 14px;
}

.dashboard-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 320px) 1fr;
  gap: 16px;
  align-items: end;
  margin: 18px 0 16px;
}

.dashboard-toolbar > label {
  display: block;
  margin-bottom: 9px;
  color: var(--color-text-muted);
  font-size: 13px;
  font-weight: 700;
}

.dashboard-equipo-selector {
  position: relative;
}

.dashboard-equipo-selector button {
  width: 100%;
  min-height: 52px;
  padding: 12px 16px;
  border: 1px solid rgba(55, 230, 161, 0.14);
  border-radius: 16px;
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.88), rgba(3, 14, 21, 0.68));
  color: var(--color-text);
  text-align: left;
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.22),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.dashboard-equipo-selector button::after {
  content: "⌄";
  position: absolute;
  top: 50%;
  right: 14px;
  transform: translateY(-50%);
  color: var(--color-text-muted);
  font-size: 15px;
}

.dashboard-equipo-opciones {
  display: grid;
  gap: 8px;
  margin-top: 10px;
  padding: 10px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 16px;
  background: rgba(3, 14, 21, 0.88);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.24);
}

.dashboard-equipo-opciones[hidden] {
  display: none;
}

.dashboard-equipo-opcion {
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid transparent;
  background: rgba(255, 255, 255, 0.04);
  color: var(--color-text);
  text-align: left;
}

.dashboard-equipo-opcion:hover {
  background: rgba(55, 230, 161, 0.1);
  border-color: rgba(55, 230, 161, 0.18);
}

.dashboard-equipo-opcion.activa {
  background: rgba(55, 230, 161, 0.14);
  border-color: rgba(55, 230, 161, 0.24);
  color: var(--color-primary);
}

.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-top: 18px;
}

.dashboard-card {
  position: relative;
  overflow: hidden;
  padding: 18px 18px 16px;
  border: 1px solid rgba(55, 230, 161, 0.12);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(83, 200, 255, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.9), rgba(3, 14, 21, 0.7));
  box-shadow:
    0 14px 32px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.dashboard-card::after {
  content: "";
  position: absolute;
  inset: auto -18px -18px auto;
  width: 84px;
  height: 84px;
  border-radius: 28px;
  background: radial-gradient(circle, rgba(55, 230, 161, 0.14), transparent 68%);
  filter: blur(12px);
  pointer-events: none;
}

.dashboard-card h3 {
  margin: 0 0 8px;
  color: var(--color-text-muted);
  font-size: 13px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.dashboard-card p {
  margin: 0;
  color: var(--color-text);
  font-size: 28px;
  font-weight: 800;
}

.dashboard-resumen {
  display: grid;
  gap: 14px;
}

.dashboard-graficos {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 16px;
  margin-top: 18px;
}

.dashboard-chart-card {
  position: relative;
  overflow: hidden;
  padding: 18px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(83, 200, 255, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.88), rgba(3, 14, 21, 0.68));
  box-shadow:
    0 14px 32px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.dashboard-chart-card h3 {
  margin: 0 0 6px;
}

.dashboard-chart-card p {
  margin: 0;
  color: var(--color-text-muted);
}

.dashboard-chart-wrap {
  height: 280px;
  margin-top: 14px;
}

.dashboard-vacio {
  margin: 12px 0 0;
  color: var(--color-text-muted);
}

.dashboard-chart-card canvas {
  width: 100% !important;
  height: 100% !important;
}

.estadisticas-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 320px) 1fr;
  gap: 16px;
  align-items: end;
  margin: 18px 0 16px;
}

.estadisticas-toolbar label {
  display: block;
  margin-bottom: 9px;
  color: var(--color-text-muted);
  font-size: 13px;
  font-weight: 700;
}

.estadisticas-equipo-selector {
  position: relative;
}

.estadisticas-equipo-selector button {
  width: 100%;
  min-height: 52px;
  padding: 12px 16px;
  border: 1px solid rgba(55, 230, 161, 0.14);
  border-radius: 16px;
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.88), rgba(3, 14, 21, 0.68));
  color: var(--color-text);
  text-align: left;
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.22),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.estadisticas-equipo-selector button::after {
  content: "⌄";
  position: absolute;
  top: 50%;
  right: 14px;
  transform: translateY(-50%);
  color: var(--color-text-muted);
  font-size: 15px;
}

.estadisticas-equipo-opciones {
  display: grid;
  gap: 8px;
  margin-top: 10px;
  padding: 10px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 16px;
  background: rgba(3, 14, 21, 0.88);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.24);
}

.estadisticas-equipo-opciones[hidden] {
  display: none;
}

.estadisticas-equipo-opcion {
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid transparent;
  background: rgba(255, 255, 255, 0.04);
  color: var(--color-text);
  text-align: left;
}

.estadisticas-equipo-opcion:hover {
  background: rgba(55, 230, 161, 0.1);
  border-color: rgba(55, 230, 161, 0.18);
}

.estadisticas-equipo-opcion.activa {
  background: rgba(55, 230, 161, 0.14);
  border-color: rgba(55, 230, 161, 0.24);
  color: var(--color-primary);
}

.estadisticas-graficos {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 16px;
  margin-top: 18px;
}

.estadisticas-grafico-card {
  position: relative;
  overflow: hidden;
  padding: 18px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(83, 200, 255, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.88), rgba(3, 14, 21, 0.68));
  box-shadow:
    0 14px 32px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.estadisticas-grafico-card::after {
  content: "";
  position: absolute;
  inset: auto -18px -18px auto;
  width: 84px;
  height: 84px;
  border-radius: 28px;
  background: radial-gradient(circle, rgba(55, 230, 161, 0.14), transparent 68%);
  filter: blur(12px);
  pointer-events: none;
}

.estadisticas-card-cabecera {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.estadisticas-card-cabecera h3 {
  margin: 0 0 6px;
}

.estadisticas-card-cabecera p {
  margin: 0;
  color: var(--color-text-muted);
}

.estadisticas-canvas-wrap {
  position: relative;
  height: 320px;
  margin-top: 14px;
}

.estadisticas-ranking-wrap {
  height: 360px;
}

.estadisticas-vacio {
  margin: 12px 0 0;
  color: var(--color-text-muted);
}

.estadisticas-ranking-cabecera button {
  white-space: nowrap;
}

.asistencia-cabecera {
  display: grid;
  grid-template-columns: minmax(320px, 1.25fr) minmax(320px, 0.75fr);
  gap: 18px;
  align-items: end;
  margin-bottom: 18px;
}

.asistencia-selector > label {
  display: block;
  margin-bottom: 9px;
  color: var(--color-text-muted);
  font-size: 13px;
  font-weight: 700;
}

.asistencia-sesion-trigger {
  position: relative;
  width: 100%;
  min-height: 52px;
  padding: 12px 16px;
  border: 1px solid rgba(55, 230, 161, 0.14);
  border-radius: 16px;
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.88), rgba(3, 14, 21, 0.68));
  color: var(--color-text);
  text-align: left;
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.22),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.asistencia-sesion-trigger::after {
  content: "⌄";
  position: absolute;
  top: 50%;
  right: 14px;
  transform: translateY(-50%);
  color: var(--color-text-muted);
  font-size: 15px;
}

.asistencia-sesion-opciones {
  display: grid;
  gap: 8px;
  margin-top: 10px;
  padding: 10px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 16px;
  background: rgba(3, 14, 21, 0.88);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.24);
}

.asistencia-sesion-opciones[hidden] {
  display: none;
}

.asistencia-sesion-opcion {
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid transparent;
  background: rgba(255, 255, 255, 0.04);
  color: var(--color-text);
  text-align: left;
}

.asistencia-sesion-opcion:hover {
  background: rgba(55, 230, 161, 0.1);
  border-color: rgba(55, 230, 161, 0.18);
}

.asistencia-sesion-opcion.activa {
  background: rgba(55, 230, 161, 0.14);
  border-color: rgba(55, 230, 161, 0.24);
  color: var(--color-primary);
}

.asistencia-resumen {
  display: grid;
  gap: 10px;
  padding: 16px 18px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(83, 200, 255, 0.08), transparent 32%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.78), rgba(3, 14, 21, 0.66));
}

.asistencia-sesion-info {
  display: grid;
  gap: 4px;
}

.asistencia-sesion-info strong {
  color: var(--color-text);
  font-size: 18px;
}

.asistencia-sesion-info span {
  color: var(--color-text-muted);
  font-size: 13px;
}

.asistencia-contador {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.asistencia-contador span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 999px;
  background: rgba(3, 17, 25, 0.62);
  color: var(--color-text);
  font-size: 12px;
  font-weight: 650;
}

.item-asistencia {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 12px;
  padding: 18px 20px;
  border: 1px solid rgba(55, 230, 161, 0.12);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.9), rgba(3, 14, 21, 0.68));
  box-shadow:
    0 14px 32px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.asistencia-identidad {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.asistencia-avatar {
  display: grid;
  place-items: center;
  flex: 0 0 52px;
  width: 52px;
  height: 52px;
  border-radius: 16px;
  border: 1px solid rgba(83, 200, 255, 0.18);
  background:
    radial-gradient(circle at top right, rgba(83, 200, 255, 0.12), transparent 38%),
    rgba(3, 17, 25, 0.78);
  color: #78d7ff;
  font-weight: 800;
  background-size: cover;
  background-position: center;
}

.asistencia-datos {
  min-width: 0;
}

.asistencia-datos strong {
  display: block;
  color: var(--color-text);
  font-size: 17px;
}

.asistencia-datos span {
  color: var(--color-text-muted);
  font-size: 13px;
}

.asistencia-controles {
  display: grid;
  gap: 10px;
  justify-items: end;
}

.asistencia-estado-selector,
.asistencia-motivo-opciones {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.asistencia-estado-opcion,
.asistencia-motivo-opcion,
.asistencia-ocultar-justificacion,
.asistencia-guardar-justificacion {
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(83, 200, 255, 0.16);
  background: rgba(3, 17, 25, 0.6);
  color: var(--color-text);
  font-size: 12px;
  font-weight: 650;
}

.asistencia-estado-opcion.activa,
.asistencia-motivo-opcion.activa {
  border-color: rgba(55, 230, 161, 0.28);
  background: rgba(55, 230, 161, 0.12);
  color: var(--color-primary);
}

.asistencia-motivo {
  display: grid;
  gap: 10px;
}

.asistencia-motivo-detalle {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.asistencia-motivo-otro {
  min-width: min(100%, 260px);
  min-height: 38px;
  padding: 0 12px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 12px;
  background: rgba(3, 17, 25, 0.7);
  color: var(--color-text);
}

.asistencia-footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 18px;
}

.sesion-estado {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.sesion-estado-chip {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 10px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 999px;
  background: rgba(3, 17, 25, 0.62);
  color: var(--color-text-muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.sesion-estado-chip.activo {
  border-color: rgba(255, 211, 90, 0.34);
  background: rgba(255, 211, 90, 0.12);
  color: #ffd65a;
}

.sesiones-acciones {
  gap: 10px;
}

.modal-contenido-confirmacion {
  position: relative;
  overflow: hidden;
  display: grid;
  gap: 18px;
  max-width: 640px;
  padding: 26px 28px 24px;
  border: 1px solid rgba(55, 230, 161, 0.14);
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.1), transparent 30%),
    linear-gradient(180deg, rgba(7, 20, 28, 0.98), rgba(3, 11, 17, 0.98));
  box-shadow:
    0 26px 72px rgba(0, 0, 0, 0.5),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.modal-contenido-confirmacion,
.sesion-form-card,
.sesiones-hero-premium-card {
  animation: premiumCardIn 220ms ease;
}

@keyframes premiumCardIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.modal-contenido-confirmacion::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(120deg, rgba(55, 230, 161, 0.06), transparent 28%, transparent 72%, rgba(83, 200, 255, 0.05));
}

.modal-confirmacion-acento {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 88px;
  height: 88px;
  border-radius: 28px;
  background: radial-gradient(circle, rgba(55, 230, 161, 0.28), transparent 68%);
  filter: blur(4px);
  opacity: 0.7;
}

.modal-icono-confirmacion {
  position: relative;
  z-index: 1;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(83, 200, 255, 0.16);
  border-radius: 16px;
  background: rgba(83, 200, 255, 0.1);
  box-shadow: 0 0 0 1px rgba(83, 200, 255, 0.08) inset;
}

.modal-icono-confirmacion svg {
  width: 24px;
  height: 24px;
  fill: #53c8ff;
}

.modal-confirmacion-texto {
  position: relative;
  z-index: 1;
}

.modal-confirmacion-texto h3 {
  margin: 0 0 8px;
  font-size: 24px;
}

.modal-confirmacion-texto p {
  margin: 0;
  color: var(--color-text-muted);
  line-height: 1.55;
}

.modal-acciones-confirmacion {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: flex-end;
  gap: 12px;
}

@media (max-width: 1120px) {
  .sesion-form-layout {
    grid-template-columns: 1fr;
  }

  .sesion-calendario {
    max-width: 560px;
  }
}

/* ========================================================================== */
/* PANEL DE ASISTENCIA                                                         */
/* ========================================================================== */

.asistencia-selector > label {
  display: block;
  margin-bottom: 9px;
  color: var(--color-text-muted);
  font-size: 13px;
  font-weight: 700;
}

#panelLista #listaSesionSelect {
  margin: 0;
}

.asistencia-cabecera {
  display: grid;
  grid-template-columns: minmax(320px, 1.25fr) minmax(320px, 0.75fr);
  gap: 18px;
  align-items: end;
  margin-bottom: 18px;
}

#panelLista #listaResumenPremium {
  margin-top: 14px;
}

.lista-estado-entrenamiento {
  display: grid;
  gap: 14px;
  margin-bottom: 18px;
  padding: 18px 20px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(83, 200, 255, 0.1), transparent 36%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.88), rgba(3, 14, 21, 0.68));
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.3),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.lista-estado-entrenamiento[data-tono="alto"] {
  border-color: rgba(55, 230, 161, 0.22);
}

.lista-estado-entrenamiento[data-tono="medio"] {
  border-color: rgba(83, 200, 255, 0.18);
}

.lista-estado-entrenamiento[data-tono="bajo"] {
  border-color: rgba(255, 190, 70, 0.2);
}

.lista-estado-entrenamiento-cabecera {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.lista-estado-entrenamiento-etiqueta {
  display: inline-flex;
  width: fit-content;
  margin-bottom: 6px;
  padding: 5px 9px;
  border-radius: 999px;
  background: rgba(83, 200, 255, 0.12);
  color: #7fdcff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.lista-estado-entrenamiento h3 {
  margin: 0;
  font-size: 22px;
}

.lista-estado-entrenamiento p {
  margin: 6px 0 0;
  color: var(--color-text-muted);
}

.lista-estado-entrenamiento-badge {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(55, 230, 161, 0.28);
  background: rgba(55, 230, 161, 0.1);
  color: var(--color-primary);
  font-size: 13px;
  font-weight: 750;
  white-space: nowrap;
}

.lista-estado-entrenamiento-metrica {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.lista-estado-entrenamiento-metrica span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 999px;
  background: rgba(3, 17, 25, 0.62);
  color: var(--color-text);
  font-size: 12px;
  font-weight: 650;
}

.asistencia-selector {
  min-width: 0;
}

.asistencia-resumen {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 66px;
  margin: 0;
  padding: 15px 18px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: rgba(3, 14, 21, 0.42);
}

#panelLista .asistencia-resumen {
  border: 1px solid rgba(55, 230, 161, 0.16);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.12), transparent 36%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.88), rgba(3, 14, 21, 0.68));
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.3),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.asistencia-sesion-info {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 4px;
}

.asistencia-sesion-info strong {
  overflow: hidden;
  color: var(--color-text);
  font-size: 16px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.asistencia-sesion-info span {
  color: var(--color-text-muted);
  font-size: 13px;
}

.asistencia-contador {
  flex: 0 0 auto;
  padding: 7px 11px;
  border: 1px solid rgba(55, 230, 161, 0.32);
  border-radius: 999px;
  background: rgba(55, 230, 161, 0.1);
  color: var(--color-primary);
  font-size: 13px;
  font-weight: 750;
}

#panelLista .asistencia-contador {
  border-color: rgba(83, 200, 255, 0.22);
  background: rgba(83, 200, 255, 0.1);
  color: #7fdcff;
}

#listaAsistencia {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
  gap: 11px;
}

#listaAsistencia .item-asistencia {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-width: 0;
  min-height: 78px;
  padding: 13px 15px;
  border: 1px solid var(--color-border);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(9, 27, 37, 0.88), rgba(5, 19, 27, 0.84));
  box-shadow: none;
  transition:
    border-color var(--transition-fast),
    background var(--transition-fast),
    box-shadow var(--transition-fast);
}

#panelLista .item-asistencia {
  border-radius: 16px;
  border-color: rgba(55, 230, 161, 0.12);
}

#panelLista .item-asistencia[data-estado="presente"] {
  box-shadow: inset 3px 0 0 rgba(55, 230, 161, 0.6);
}

#panelLista .item-asistencia[data-estado="ausente"] {
  box-shadow: inset 3px 0 0 rgba(255, 107, 122, 0.55);
}

#panelLista .item-asistencia[data-estado="justificada"] {
  box-shadow: inset 3px 0 0 rgba(255, 190, 70, 0.58);
}

#listaAsistencia .item-asistencia:hover,
#listaAsistencia .item-asistencia:focus-within {
  border-color: rgba(83, 200, 255, 0.48);
  background: linear-gradient(
    145deg,
    rgba(14, 39, 51, 0.96),
    rgba(8, 27, 37, 0.92)
  );
  box-shadow:
    0 10px 24px rgba(0, 0, 0, 0.16),
    inset 3px 0 0 rgba(83, 200, 255, 0.68);
}

.asistencia-identidad {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 12px;
}

.asistencia-avatar {
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  place-items: center;
  border: 1px solid rgba(83, 200, 255, 0.28);
  border-radius: 50%;
  background-color: rgba(83, 200, 255, 0.1);
  background-position: center;
  background-size: cover;
  color: #79d9ff;
  font-size: 17px;
  font-weight: 800;
}

.asistencia-datos {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 4px;
}

.asistencia-datos strong {
  overflow: hidden;
  color: var(--color-text);
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.asistencia-datos span {
  color: var(--color-text-muted);
  font-size: 12px;
  text-transform: capitalize;
}

.asistencia-estado {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.asistencia-estado input {
  position: absolute;
  width: 1px !important;
  height: 1px;
  margin: 0;
  opacity: 0;
  pointer-events: none;
}

.asistencia-switch {
  position: relative;
  width: 42px;
  height: 24px;
  border: 1px solid rgba(255, 107, 122, 0.35);
  border-radius: 999px;
  background: rgba(255, 107, 122, 0.12);
  transition:
    border-color var(--transition-fast),
    background var(--transition-fast);
}

.asistencia-switch::after {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #ff8995;
  content: "";
  transition:
    transform var(--transition-fast),
    background var(--transition-fast);
}

.asistencia-estado input:checked + .asistencia-switch {
  border-color: rgba(55, 230, 161, 0.5);
  background: rgba(55, 230, 161, 0.16);
}

.asistencia-estado input:checked + .asistencia-switch::after {
  transform: translateX(18px);
  background: var(--color-primary);
}

.asistencia-estado input:focus-visible + .asistencia-switch {
  outline: 3px solid rgba(83, 200, 255, 0.45);
  outline-offset: 2px;
}

.asistencia-estado-texto {
  width: 58px;
  color: #ff8995;
  font-size: 12px;
  font-weight: 720;
}

.asistencia-estado input:checked ~ .asistencia-estado-texto {
  color: var(--color-primary);
}

.asistencia-footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--color-border);
}

.asistencia-controles {
  display: flex;
  width: 156px;
  flex: 0 0 156px;
  flex-direction: column;
  gap: 7px;
}

.asistencia-estado-select,
.asistencia-motivo-select,
.asistencia-motivo-otro {
  width: 100%;
  min-width: 0;
  height: 36px;
  margin: 0;
  padding: 0 10px;
  border-radius: 9px;
  font-size: 12px;
  font-weight: 700;
}

.item-asistencia[data-estado="presente"] .asistencia-estado-select {
  border-color: rgba(55, 230, 161, 0.45);
  color: var(--color-primary);
}

.item-asistencia[data-estado="ausente"] .asistencia-estado-select {
  border-color: rgba(255, 107, 122, 0.42);
  color: #ff8995;
}

.item-asistencia[data-estado="justificada"] .asistencia-estado-select {
  border-color: rgba(255, 190, 70, 0.5);
  color: #ffc75e;
}

.asistencia-motivo {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.asistencia-motivo-detalle {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.asistencia-ocultar-justificacion,
.asistencia-guardar-justificacion {
  width: 100%;
  min-height: 38px;
  padding: 8px 12px;
  border: 1px solid rgba(255, 190, 70, 0.5);
  border-radius: 9px;
  background: rgba(255, 190, 70, 0.09);
  color: #ffc75e;
  font-size: 12px;
  font-weight: 750;
  text-align: center;
}

.asistencia-ocultar-justificacion:hover {
  border-color: rgba(255, 211, 126, 0.72);
  background: rgba(255, 190, 70, 0.15);
  color: #ffd98a;
}

.asistencia-guardar-justificacion {
  border-color: rgba(55, 230, 161, 0.5);
  background: rgba(55, 230, 161, 0.1);
  color: var(--color-primary);
}

.asistencia-guardar-justificacion:hover {
  border-color: rgba(55, 230, 161, 0.75);
  background: rgba(55, 230, 161, 0.17);
}

.asistencia-motivo[hidden],
.asistencia-motivo-otro[hidden] {
  display: none;
}

.item-asistencia:has(.asistencia-motivo:not([hidden])) {
  min-height: 122px;
}

@media (max-width: 900px) {
  #listaAsistencia {
    grid-template-columns: 1fr;
  }

  .asistencia-cabecera {
    grid-template-columns: 1fr;
  }

  .asistencia-resumen {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* Selectores de asistencia integrados en el flujo, sin menús superpuestos. */
.asistencia-sesion-trigger {
  position: relative;
  width: 100%;
  min-height: 56px;
  padding: 0 46px 0 18px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-input);
  color: var(--color-text);
  text-align: left;
}

#panelLista .asistencia-sesion-trigger {
  border-color: rgba(55, 230, 161, 0.18);
  background:
    linear-gradient(180deg, rgba(3, 17, 25, 0.9), rgba(3, 14, 21, 0.72));
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.asistencia-sesion-trigger::after {
  position: absolute;
  right: 18px;
  content: "⌄";
}

.asistencia-sesion-opciones {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 8px;
  margin-top: 8px;
  padding: 8px;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  background: rgba(3, 14, 21, 0.72);
}

#panelLista .asistencia-sesion-opciones {
  border-color: rgba(55, 230, 161, 0.16);
}

.asistencia-sesion-opciones[hidden] { display: none !important; }

.asistencia-sesion-opcion {
  min-height: 40px;
  border: 1px solid transparent;
  border-radius: 9px;
  background: rgba(83, 200, 255, 0.08);
  color: var(--color-text-muted);
  text-align: left;
}

.asistencia-sesion-opcion:hover {
  border-color: rgba(83, 200, 255, 0.35);
  color: var(--color-text);
}

.asistencia-sesion-opcion.activa {
  border-color: rgba(55, 230, 161, 0.42);
  background: rgba(55, 230, 161, 0.12);
  color: var(--color-primary);
  box-shadow: inset 3px 0 0 var(--color-primary);
}

.asistencia-contador {
  width: fit-content;
  max-width: 100%;
  line-height: 1.35;
  text-align: center;
}

.asistencia-resumen {
  align-items: flex-start;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
}

.asistencia-sesion-info,
.asistencia-sesion-info strong {
  width: 100%;
}

.asistencia-sesion-info strong {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
}

.asistencia-controles {
  width: 240px;
  flex-basis: 240px;
}

@media (max-width: 1550px) {
  #listaAsistencia {
    grid-template-columns: 1fr;
  }

  .asistencia-controles {
    width: 320px;
    flex-basis: 320px;
  }

  .asistencia-datos strong {
    white-space: normal;
  }

  .item-asistencia:has(.asistencia-motivo:not([hidden])) {
    min-height: 112px;
  }

  .item-asistencia:has(.asistencia-motivo:not([hidden])) .asistencia-controles {
    width: min(620px, 68%);
    flex-basis: min(620px, 68%);
  }

  .item-asistencia:has(.asistencia-motivo:not([hidden])) .asistencia-motivo {
    align-items: center;
    flex-direction: row;
  }

  .item-asistencia:has(.asistencia-motivo:not([hidden])) .asistencia-motivo-opciones {
    flex: 1 1 auto;
  }

  .item-asistencia:has(.asistencia-motivo:not([hidden])) .asistencia-motivo-detalle {
    width: 230px;
    flex: 0 1 230px;
  }

  .item-asistencia:has(.asistencia-motivo:not([hidden])) .asistencia-motivo-otro {
    width: 100%;
  }
}

.asistencia-estado-selector,
.asistencia-motivo-opciones {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.asistencia-estado-opcion,
.asistencia-motivo-opcion {
  min-height: 30px;
  padding: 5px 8px;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: rgba(3, 14, 21, 0.55);
  color: var(--color-text-muted);
  font-size: 11px;
  font-weight: 700;
}

.asistencia-estado-opcion.activa[data-estado="presente"] {
  border-color: rgba(55, 230, 161, 0.5);
  background: rgba(55, 230, 161, 0.12);
  color: var(--color-primary);
}

.asistencia-estado-opcion.activa[data-estado="ausente"] {
  border-color: rgba(255, 107, 122, 0.45);
  background: rgba(255, 107, 122, 0.1);
  color: #ff8995;
}

.asistencia-estado-opcion.activa[data-estado="justificada"],
.asistencia-motivo-opcion.activa {
  border-color: rgba(255, 190, 70, 0.5);
  background: rgba(255, 190, 70, 0.1);
  color: #ffc75e;
}

@media (max-width: 680px) {
  #listaAsistencia .item-asistencia {
    align-items: stretch;
    flex-direction: column;
  }

  .asistencia-controles {
    width: 100%;
    flex-basis: auto;
  }

  .item-asistencia:has(.asistencia-motivo:not([hidden])) .asistencia-controles {
    width: 100%;
    flex-basis: auto;
  }

  .item-asistencia:has(.asistencia-motivo:not([hidden])) .asistencia-motivo {
    align-items: stretch;
    flex-direction: column;
  }

  .item-asistencia:has(.asistencia-motivo:not([hidden])) .asistencia-motivo-detalle,
  .item-asistencia:has(.asistencia-motivo:not([hidden])) .asistencia-motivo-otro {
    width: 100%;
    flex-basis: auto;
  }
}

/* ========================================================================== */
/* DASHBOARD                                                                  */
/* ========================================================================== */

.dashboard-toolbar {
  display: grid;
  grid-template-columns: auto minmax(240px, 360px);
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
  padding: 14px 16px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: rgba(3, 14, 21, 0.42);
}

.dashboard-toolbar label {
  color: var(--color-text-muted);
  font-size: 13px;
  font-weight: 750;
}

#filtroEquipoDashboardTrigger {
  position: relative;
  width: 100%;
  min-height: 46px;
  padding: 0 42px 0 14px;
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: var(--color-input);
  color: var(--color-text);
  text-align: left;
}

#filtroEquipoDashboardTrigger::after {
  position: absolute;
  right: 15px;
  content: "⌄";
}

.dashboard-equipo-opciones {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 7px;
  margin-top: 8px;
  padding: 8px;
  border: 1px solid var(--color-border);
  border-radius: 11px;
  background: rgba(3, 14, 21, 0.72);
}

.dashboard-equipo-opciones[hidden] { display: none; }

.dashboard-equipo-opcion {
  min-height: 38px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: rgba(83, 200, 255, 0.08);
  color: var(--color-text-muted);
  text-align: left;
}

.dashboard-equipo-opcion:hover,
.dashboard-equipo-opcion.activa {
  border-color: rgba(55, 230, 161, 0.42);
  color: var(--color-primary);
}

.dashboard-equipo-opcion.activa {
  background: rgba(55, 230, 161, 0.12);
  box-shadow: inset 3px 0 0 var(--color-primary);
}

/* ===========================
   ESTADÍSTICAS PREMIUM
=========================== */

.panel-hero-estadisticas {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

#panelEstadisticas .panel-resumen-premium {
  margin-top: 14px;
}

#panelEstadisticas .estadisticas-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 320px) 1fr;
  gap: 16px;
  align-items: end;
  margin: 18px 0 16px;
  padding: 0;
  border: 0;
  background: transparent;
}

#panelEstadisticas .estadisticas-toolbar > label {
  display: block;
  margin-bottom: 9px;
  color: var(--color-text-muted);
  font-size: 13px;
  font-weight: 700;
}

#panelEstadisticas .estadisticas-equipo-selector {
  position: relative;
}

#panelEstadisticas #filtroEquipoEstadisticasTrigger {
  min-height: 52px;
  padding: 12px 16px 12px 16px;
  border: 1px solid rgba(55, 230, 161, 0.14);
  border-radius: 16px;
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.88), rgba(3, 14, 21, 0.68));
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.22),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

#panelEstadisticas #filtroEquipoEstadisticasTrigger::after {
  content: "⌄";
  position: absolute;
  top: 50%;
  right: 14px;
  transform: translateY(-50%);
  color: var(--color-text-muted);
}

#panelEstadisticas .estadisticas-equipo-opciones {
  margin-top: 10px;
  padding: 10px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 16px;
  background: rgba(3, 14, 21, 0.88);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.24);
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
}

#panelEstadisticas .estadisticas-equipo-opcion {
  min-height: 38px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
  color: var(--color-text-muted);
  text-align: left;
}

#panelEstadisticas .estadisticas-equipo-opcion:hover {
  border-color: rgba(55, 230, 161, 0.18);
  background: rgba(55, 230, 161, 0.1);
  color: var(--color-text);
}

#panelEstadisticas .estadisticas-equipo-opcion.activa {
  border-color: rgba(55, 230, 161, 0.24);
  background: rgba(55, 230, 161, 0.14);
  color: var(--color-primary);
  box-shadow: inset 3px 0 0 var(--color-primary);
}

#panelEstadisticas .stats-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 22px;
}

#panelEstadisticas .stat-card {
  position: relative;
  overflow: hidden;
  display: flex;
  min-height: 132px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: 22px;
  border: 1px solid rgba(55, 230, 161, 0.12);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(83, 200, 255, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.9), rgba(3, 14, 21, 0.68));
  box-shadow:
    0 14px 32px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

#panelEstadisticas .stat-card::after {
  content: "";
  position: absolute;
  inset: auto -18px -18px auto;
  width: 84px;
  height: 84px;
  border-radius: 28px;
  background: radial-gradient(circle, rgba(55, 230, 161, 0.14), transparent 68%);
  filter: blur(12px);
  pointer-events: none;
}

#panelEstadisticas .stat-title,
#panelEstadisticas .stat-value {
  display: block;
}

#panelEstadisticas .stat-title {
  margin-bottom: 12px;
  color: var(--color-text-muted);
  font-size: 13px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

#panelEstadisticas .stat-value {
  color: var(--color-text);
  font-size: 32px;
  font-weight: 800;
}

#panelEstadisticas .stat-card-justificadas .stat-value {
  color: #ffc75e;
}

#panelEstadisticas .estadisticas-graficos {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 16px;
  margin-top: 18px;
}

#panelEstadisticas .estadisticas-grafico-card {
  position: relative;
  overflow: hidden;
  padding: 18px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(83, 200, 255, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.88), rgba(3, 14, 21, 0.68));
  box-shadow:
    0 14px 32px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

#panelEstadisticas .estadisticas-grafico-card::after {
  content: "";
  position: absolute;
  inset: auto -18px -18px auto;
  width: 84px;
  height: 84px;
  border-radius: 28px;
  background: radial-gradient(circle, rgba(55, 230, 161, 0.14), transparent 68%);
  filter: blur(12px);
  pointer-events: none;
}

#panelEstadisticas .estadisticas-card-cabecera {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}

#panelEstadisticas .estadisticas-card-cabecera h3 {
  margin: 0 0 5px;
  color: var(--color-text);
}

#panelEstadisticas .estadisticas-card-cabecera p {
  margin: 0;
  color: var(--color-text-muted);
  font-size: 13px;
}

#panelEstadisticas .estadisticas-canvas-wrap {
  position: relative;
  height: 320px;
  min-height: 280px;
}

#panelEstadisticas .estadisticas-ranking-wrap {
  height: 360px;
}

#panelEstadisticas .estadisticas-canvas-wrap canvas {
  width: 100% !important;
  height: 100% !important;
}

#panelEstadisticas .estadisticas-vacio {
  display: grid;
  min-height: 190px;
  margin: 0;
  place-items: center;
  border: 1px dashed var(--color-border);
  border-radius: var(--radius-md);
  color: var(--color-text-muted);
}

#panelEstadisticas .estadisticas-vacio[hidden] {
  display: none;
}

#panelEstadisticas .estadisticas-ranking-cabecera .btn-secundario {
  flex: 0 0 auto;
  min-height: 40px;
}

@media (max-width: 1100px) {
  #panelEstadisticas .stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #panelEstadisticas .estadisticas-graficos {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {
  #panelEstadisticas .estadisticas-toolbar,
  #panelEstadisticas .stats-grid {
    grid-template-columns: 1fr;
  }
  #panelEstadisticas .estadisticas-card-cabecera {
    flex-direction: column;
  }
}

/* ========================================================================== */
/* BRAND + EQUIPOS PREMIUM REFINADO                                           */
/* ========================================================================== */

.logo {
  font-size: 23px;
  font-weight: 840;
  letter-spacing: -0.055em;
}

.logo::after {
  width: 70px;
  height: 2px;
  margin-top: 10px;
  background: linear-gradient(90deg, rgba(48, 216, 154, 0.96), rgba(103, 191, 240, 0.72));
  opacity: 0.9;
}

.equipo-card {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 16px;
  padding: 18px 20px;
  border: 1px solid rgba(55, 230, 161, 0.12);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.08), transparent 36%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.9), rgba(3, 14, 21, 0.72));
  box-shadow:
    0 14px 32px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(16px) saturate(126%);
  -webkit-backdrop-filter: blur(16px) saturate(126%);
}

.equipo-card::after {
  content: "";
  position: absolute;
  inset: auto -18px -18px auto;
  width: 84px;
  height: 84px;
  border-radius: 28px;
  background: radial-gradient(circle, rgba(48, 216, 154, 0.14), transparent 68%);
  filter: blur(12px);
  pointer-events: none;
}

.equipo-card:hover {
  transform: translateY(-2px);
  border-color: rgba(55, 230, 161, 0.22);
  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.3),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.equipo-card-icono {
  width: 52px;
  height: 52px;
  border: 1px solid rgba(83, 200, 255, 0.16);
  border-radius: 16px;
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.2), transparent 55%),
    rgba(255, 255, 255, 0.04);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow:
    0 10px 22px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}

.equipo-card-icono svg {
  width: 26px;
  height: 26px;
  fill: #7fe5ff;
}

.equipo-card:hover .equipo-card-icono {
  transform: scale(1.05);
  border-color: rgba(83, 200, 255, 0.3);
}

.equipo-card-nombre {
  flex: 1;
  color: var(--color-text);
  font-size: 21px;
  font-weight: 800;
  letter-spacing: -0.03em;
}

.equipo-card-stats {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 120px;
  color: var(--color-text-muted);
  font-size: 13px;
}

.equipo-card-acciones {
  display: flex;
  gap: 10px;
}

.equipo-btn {
  width: 42px;
  height: 42px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.05);
  color: var(--color-text);
  cursor: pointer;
}

.equipo-btn:hover {
  transform: translateY(-1px);
  background: rgba(255, 255, 255, 0.08);
}

.equipo-btn.editar {
  border-color: rgba(83, 200, 255, 0.22);
  color: #7fdfff;
}

.equipo-btn.eliminar {
  border-color: rgba(255, 107, 122, 0.22);
  color: #ff8d9a;
}

/* ========================================================================== */
/* SISTEMA PREMIUM COMÚN PARA TODOS LOS PANELES                               */
/* ========================================================================== */

.panel-headline {
  margin-bottom: 14px;
}

.panel-headline h2 {
  margin-bottom: 8px;
  color: var(--color-text);
  font-size: clamp(27px, 3vw, 38px);
  font-weight: 800;
  letter-spacing: -0.055em;
}

.panel-subtitulo {
  max-width: 860px;
  color: #a0b4bd;
  font-size: 15px;
  line-height: 1.5;
}

.panel-hero-premium,
.panel-resumen-premium,
.sesiones-hero-premium,
.dashboard-grid,
.dashboard-graficos,
.estadisticas-graficos {
  margin-top: 18px;
}

.panel-hero-premium-card,
.panel-resumen-premium-card,
.sesiones-hero-premium-card,
.dashboard-card,
.dashboard-chart-card,
.estadisticas-grafico-card,
.lista-estado-entrenamiento,
.entrenamiento-proxima-sesion,
.entrenamiento-bloque,
.entrenamiento-detalle,
.entrenamiento-recurso,
#panelEstadisticas .stat-card {
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.08), transparent 36%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.92), rgba(3, 14, 21, 0.74));
  box-shadow:
    0 16px 34px rgba(0, 0, 0, 0.28),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(16px) saturate(124%);
  -webkit-backdrop-filter: blur(16px) saturate(124%);
}

.panel-hero-premium-card::after,
.panel-resumen-premium-card::after,
.sesiones-hero-premium-card::after,
.dashboard-card::after,
.dashboard-chart-card::after,
.estadisticas-grafico-card::after,
.entrenamiento-proxima-sesion::after {
  background: radial-gradient(circle, rgba(48, 216, 154, 0.12), transparent 68%);
}

.panel-hero-premium-etiqueta,
.panel-resumen-premium-etiqueta,
.sesiones-hero-premium-etiqueta,
.lista-estado-entrenamiento-badge,
.entrenamiento-resumen-chip,
.entrenamiento-favorita-chip,
.entrenamiento-reciente-chip,
.entrenamiento-recursos .entrenamiento-recurso-tipo,
#panelEstadisticas .stat-title {
  letter-spacing: 0.05em;
}

.panel-hero-premium-card strong,
.panel-resumen-premium-card strong,
.dashboard-card p,
#panelEstadisticas .stat-value,
.equipo-card-nombre {
  letter-spacing: -0.05em;
}

.panel-hero-premium-card span,
.panel-resumen-premium-card span,
.sesiones-hero-premium-card span,
.dashboard-chart-card p,
.estadisticas-card-cabecera p,
.lista-estado-entrenamiento p,
.entrenamiento-meta,
.entrenamiento-resumen,
.entrenamiento-recurso-tipo {
  color: #9cb0b9;
}

.btn-pro,
.btn-guardar-pro,
.btn-crear,
.btn-guardar,
.btn-secundario {
  border-radius: 14px;
}

.btn-pro,
.btn-guardar-pro,
.btn-crear,
.btn-guardar,
.btn-secundario,
.equipo-btn {
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.18);
}

.btn-pro:hover,
.btn-guardar-pro:hover,
.btn-crear:hover,
.btn-guardar:hover,
.btn-secundario:hover,
.equipo-btn:hover {
  transform: translateY(-1px);
}

.listaJugadoras,
#listaSesiones,
.dashboard-grid,
.dashboard-graficos,
.estadisticas-graficos {
  gap: 16px;
}

.jugadora-card,
.item-lista,
.item-asistencia,
.equipo-card,
.dashboard-card,
.dashboard-chart-card,
.estadisticas-grafico-card {
  border-color: rgba(83, 200, 255, 0.1);
}

.jugadora-card:hover,
.item-lista:hover,
.item-asistencia:hover,
.equipo-card:hover,
.dashboard-card:hover,
.dashboard-chart-card:hover,
.estadisticas-grafico-card:hover {
  border-color: rgba(55, 230, 161, 0.22);
  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.3),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.panel .bloque {
  border-color: rgba(83, 200, 255, 0.1);
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.05), transparent 42%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.78), rgba(3, 14, 21, 0.68));
}

.panel .bloque h3,
.panel h3 {
  color: var(--color-text);
  letter-spacing: -0.04em;
}

/* ========================================================================== */
/* SESIONES + ENTRENAMIENTO: PULIDO FINAL                                     */
/* ========================================================================== */

.sesiones-hero-premium-card,
.entrenamiento-proxima-sesion,
.entrenamiento-detalle,
.entrenamiento-bloque,
.entrenamiento-recurso,
.sesion-form-card,
.sesion-seccion,
.sesion-tab-pane,
.sesion-bloque-recursos {
  border-color: rgba(83, 200, 255, 0.1);
  box-shadow:
    0 16px 34px rgba(0, 0, 0, 0.26),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.sesiones-hero-premium-card strong,
.entrenamiento-proxima-sesion h3,
.entrenamiento-bloque h4,
.sesion-tab-pane label,
.sesion-bloque-media-title {
  letter-spacing: -0.04em;
}

.sesiones-hero-premium-card span,
.entrenamiento-proxima-sesion p,
.entrenamiento-meta,
.entrenamiento-recurso-tipo,
.sesion-avanzada-aviso {
  color: #97acb6;
}

.sesiones-hero-premium-etiqueta,
.entrenamiento-proxima-sesion-etiqueta {
  background: rgba(48, 216, 154, 0.08);
  color: #7fe5bf;
}

.sesion-form-card {
  border-radius: 22px;
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.05), transparent 40%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.86), rgba(3, 14, 21, 0.72));
}

.sesion-tab {
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 14px;
  background: rgba(3, 14, 21, 0.56);
  color: var(--color-text-muted);
}

.sesion-tab.activa {
  border-color: rgba(55, 230, 161, 0.26);
  background: rgba(55, 230, 161, 0.12);
  color: #8ef0cf;
}

.sesion-tab-pane {
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.05), transparent 42%),
    rgba(3, 14, 21, 0.6);
}

.sesion-editor-texto {
  border-color: rgba(83, 200, 255, 0.12);
  background: rgba(3, 14, 21, 0.72);
}

.sesion-recurso-form {
  border-color: rgba(83, 200, 255, 0.1);
  background: rgba(3, 14, 21, 0.5);
}

.entrenamiento-selector input[type="text"],
.entrenamiento-selector select {
  border-color: rgba(83, 200, 255, 0.1);
}

.entrenamiento-reciente-chip,
.entrenamiento-favorita-chip {
  border-color: rgba(83, 200, 255, 0.1);
}

.entrenamiento-reciente-chip.activo {
  border-color: rgba(55, 230, 161, 0.34);
}

.entrenamiento-reciente-chip.favorita {
  border-color: rgba(255, 211, 90, 0.18);
}

.entrenamiento-recurso-vacio {
  border-color: rgba(83, 200, 255, 0.14);
  background: rgba(3, 14, 21, 0.4);
}

/* ========================================================================== */
/* PASAR LISTA + ESTADISTICAS: AJUSTE FINAL PREMIUM                           */
/* ========================================================================== */

#panelLista .panel-headline,
#panelEstadisticas .panel-headline {
  margin-bottom: 6px;
}

#panelLista .panel-subtitulo,
#panelEstadisticas .panel-subtitulo {
  max-width: 760px;
}

#panelLista .panel-hero-premium,
#panelEstadisticas .panel-hero-premium {
  margin-top: 20px;
  gap: 16px;
}

#panelLista .panel-hero-premium-card,
#panelEstadisticas .panel-hero-premium-card {
  padding: 22px 22px 20px;
  border-radius: 20px;
  border-color: rgba(83, 200, 255, 0.11);
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.1), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.92), rgba(3, 14, 21, 0.76));
  box-shadow:
    0 16px 36px rgba(0, 0, 0, 0.28),
    inset 0 0 0 1px rgba(255, 255, 255, 0.035);
}

#panelLista .panel-hero-premium-card strong,
#panelEstadisticas .panel-hero-premium-card strong {
  font-size: 19px;
}

#panelLista .panel-hero-premium-card span,
#panelEstadisticas .panel-hero-premium-card span {
  color: #93a9b4;
}

#panelLista .lista-estado-entrenamiento {
  padding: 20px 22px;
  border-radius: 20px;
  border-color: rgba(83, 200, 255, 0.1);
}

#panelLista .lista-estado-entrenamiento h3 {
  font-size: 20px;
  line-height: 1.1;
}

#panelLista .lista-estado-entrenamiento p {
  line-height: 1.55;
}

#panelLista .lista-estado-entrenamiento-badge {
  border-color: rgba(83, 200, 255, 0.18);
  background: rgba(83, 200, 255, 0.1);
  color: #86dcff;
}

#panelLista .lista-estado-entrenamiento-metrica span {
  background: rgba(3, 14, 21, 0.7);
}

#panelLista .asistencia-cabecera {
  gap: 16px;
  margin-bottom: 16px;
}

#panelLista .asistencia-resumen {
  min-height: 72px;
  padding: 16px 18px;
}

#panelLista .item-asistencia {
  border-radius: 18px;
  border-color: rgba(83, 200, 255, 0.11);
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.04), transparent 42%),
    linear-gradient(145deg, rgba(9, 27, 37, 0.9), rgba(5, 19, 27, 0.86));
}

#panelLista .item-asistencia .asistencia-identidad strong {
  letter-spacing: -0.03em;
}

#panelLista .item-asistencia .asistencia-estado {
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.02),
    0 10px 20px rgba(0, 0, 0, 0.12);
}

#panelEstadisticas .estadisticas-toolbar {
  margin-top: 16px;
  margin-bottom: 18px;
}

#panelEstadisticas .estadisticas-equipo-selector,
#panelEstadisticas #filtroEquipoEstadisticasTrigger {
  min-width: 0;
}

#panelEstadisticas .stats-grid {
  margin-top: 2px;
}

#panelEstadisticas .stat-card {
  min-height: 138px;
  padding: 20px 18px;
  border-radius: 20px;
}

#panelEstadisticas .stat-title {
  margin-bottom: 10px;
}

#panelEstadisticas .stat-value {
  font-size: 30px;
}

#panelEstadisticas .estadisticas-graficos {
  gap: 18px;
}

#panelEstadisticas .estadisticas-grafico-card {
  border-radius: 20px;
  padding: 20px;
}

#panelEstadisticas .estadisticas-card-cabecera h3 {
  letter-spacing: -0.04em;
}

#panelEstadisticas .estadisticas-canvas-wrap {
  height: 330px;
}

#panelEstadisticas .estadisticas-ranking-wrap {
  height: 370px;
}

/* ========================================================================== */
/* DASHBOARD: AJUSTE FINAL PREMIUM                                            */
/* ========================================================================== */

#panelDashboard .panel-headline {
  margin-bottom: 6px;
}

#panelDashboard .panel-subtitulo {
  max-width: 760px;
}

#panelDashboard .panel-hero-premium {
  margin-top: 20px;
  gap: 16px;
}

#panelDashboard .panel-hero-premium-card {
  padding: 20px 20px 18px;
  border-radius: 18px;
  border-color: rgba(83, 200, 255, 0.11);
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.1), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.92), rgba(3, 14, 21, 0.76));
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.035);
}

#panelDashboard .panel-hero-premium-card strong {
  font-size: 19px;
}

#panelDashboard .panel-hero-premium-card span {
  color: #93a9b4;
}

#panelDashboard .panel-resumen-premium {
  margin-top: 16px;
}

#panelDashboard .dashboard-toolbar {
  margin-top: 18px;
  margin-bottom: 18px;
}

#panelDashboard .dashboard-equipo-selector,
#panelDashboard #filtroEquipoDashboardTrigger {
  min-width: 0;
}

#panelDashboard .dashboard-grid {
  margin-top: 2px;
  gap: 16px;
}

#panelDashboard .dashboard-card {
  min-height: 128px;
  padding: 18px 16px 16px;
  border-radius: 18px;
  border-color: rgba(83, 200, 255, 0.11);
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.92), rgba(3, 14, 21, 0.76));
}

#panelDashboard .dashboard-card h3 {
  margin-bottom: 10px;
}

#panelDashboard .dashboard-card p {
  font-size: 28px;
}

#panelDashboard .dashboard-card-justificadas p {
  color: #ffc75e;
}

#panelDashboard .dashboard-charts {
  margin-top: 16px;
}

#panelDashboard .dashboard-chart-card {
  padding: 14px 18px 14px;
  border-radius: 18px;
  border-color: rgba(83, 200, 255, 0.12);
}

#panelDashboard .dashboard-chart-card h3 {
  letter-spacing: -0.04em;
}

#panelDashboard .dashboard-chart-card p {
  color: #95aab4;
}

#panelDashboard .dashboard-chart-principal {
  min-height: 190px;
}

#panelDashboard .dashboard-ranking-card {
  min-height: 210px;
}

#panelDashboard .dashboard-chart-wrap {
  height: 130px;
}

#panelDashboard .dashboard-vacio {
  margin-top: 10px;
  padding: 0 0 4px;
  line-height: 1.4;
}

/* ========================================================================== */
/* JUGADORAS: AJUSTE FINAL PREMIUM                                            */
/* ========================================================================== */

#panelJugadoras .panel-headline {
  margin-bottom: 6px;
}

#panelJugadoras .panel-subtitulo {
  max-width: 760px;
}

#panelJugadoras .panel-hero-premium {
  margin-top: 20px;
  gap: 16px;
}

#panelJugadoras .panel-hero-premium-card {
  padding: 20px 20px 18px;
  border-radius: 20px;
  border-color: rgba(83, 200, 255, 0.11);
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.1), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.92), rgba(3, 14, 21, 0.76));
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.035);
}

#panelJugadoras .panel-hero-premium-card strong {
  font-size: 19px;
}

#panelJugadoras .panel-hero-premium-card span {
  color: #93a9b4;
}

#panelJugadoras #tabsEquipos {
  margin-top: 18px;
}

#panelJugadoras .accionesJugadoras {
  margin-top: 16px;
  gap: 12px;
}

#panelJugadoras .accionesJugadoras input,
#panelJugadoras .accionesJugadoras select {
  min-height: 52px;
  border-color: rgba(83, 200, 255, 0.12);
  border-radius: 16px;
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.06), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.88), rgba(3, 14, 21, 0.68));
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.22),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

#panelJugadoras .accionesJugadoras button {
  min-height: 52px;
}

#panelJugadoras .listaJugadoras {
  margin-top: 16px;
  padding-top: 8px;
  gap: 18px;
}

#panelJugadoras .jugadora-card {
  position: relative;
  overflow: hidden;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 0;
  min-height: 172px;
  padding: 18px 18px 16px;
  border-radius: 20px;
  border: 1px solid rgba(83, 200, 255, 0.11);
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.05), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.9), rgba(3, 14, 21, 0.72));
  box-shadow:
    0 14px 30px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

#panelJugadoras .jugadora-card:hover {
  transform: translateY(-2px);
  border-color: rgba(55, 230, 161, 0.22);
  box-shadow:
    0 18px 38px rgba(0, 0, 0, 0.3),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

#panelJugadoras .jugadora-icono {
  width: 54px;
  height: 54px;
  border-radius: 16px;
  border-color: rgba(83, 200, 255, 0.16);
  background: rgba(3, 14, 21, 0.66);
}

#panelJugadoras .jugadora-nombre {
  color: var(--color-text);
  font-size: 18px;
  letter-spacing: -0.04em;
  line-height: 1.15;
}

#panelJugadoras .jugadora-detalles {
  margin-top: 7px;
  color: #9cb0b9;
  flex-wrap: wrap;
  gap: 8px 12px;
}

#panelJugadoras .jugadora-btn {
  border-radius: 12px;
  background: rgba(3, 14, 21, 0.58);
  border: 1px solid rgba(83, 200, 255, 0.12);
  box-shadow:
    0 10px 20px rgba(0, 0, 0, 0.16),
    inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}

#panelJugadoras .jugadora-btn:hover {
  background: rgba(55, 230, 161, 0.1);
  border-color: rgba(55, 230, 161, 0.18);
}

#panelJugadoras .jugadora-foto {
  width: 68px;
  height: 68px;
  border: 1px solid rgba(83, 200, 255, 0.18);
  box-shadow:
    0 12px 24px rgba(0, 0, 0, 0.18),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

#panelJugadoras .jugadora-card .jugadora-info {
  display: grid;
  gap: 4px;
}

#panelJugadoras .jugadora-card .jugadora-acciones {
  margin-left: auto;
  padding-top: 2px;
}

#panelJugadoras .jugadora-card .jugadora-equipo {
  margin-top: 4px;
}

#panelJugadoras .jugadora-card .jugadora-detalles span {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
}

#panelJugadoras .jugadora-card.colocadora {
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.06), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.9), rgba(3, 14, 21, 0.72));
}

#panelJugadoras .jugadora-card.receptora {
  background:
    radial-gradient(circle at top right, rgba(83, 200, 255, 0.06), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.9), rgba(3, 14, 21, 0.72));
}

#panelJugadoras .jugadora-card.opuesta {
  background:
    radial-gradient(circle at top right, rgba(255, 122, 136, 0.06), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.9), rgba(3, 14, 21, 0.72));
}

#panelJugadoras .jugadora-card.central {
  background:
    radial-gradient(circle at top right, rgba(255, 200, 87, 0.06), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.9), rgba(3, 14, 21, 0.72));
}

#panelJugadoras .jugadora-card.líbero {
  background:
    radial-gradient(circle at top right, rgba(185, 156, 255, 0.06), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.9), rgba(3, 14, 21, 0.72));
}

/* ========================================================================== */
/* USUARIOS Y ROLES                                                           */
/* ========================================================================== */

#panelUsuarios .panel-headline {
  margin-bottom: 6px;
}

#panelUsuarios .panel-subtitulo {
  max-width: 780px;
}

#panelUsuarios .panel-hero-premium {
  margin-top: 20px;
  gap: 16px;
}

#panelUsuarios .panel-hero-premium-card {
  padding: 20px 20px 18px;
  border-radius: 20px;
  border-color: rgba(83, 200, 255, 0.11);
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.1), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.92), rgba(3, 14, 21, 0.76));
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.035);
}

#panelUsuarios .panel-hero-premium-card strong {
  font-size: 19px;
}

#panelUsuarios .panel-hero-premium-card span {
  color: #93a9b4;
}

#panelUsuarios .usuarios-form-card {
  border-radius: 22px;
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.05), transparent 40%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.86), rgba(3, 14, 21, 0.72));
}

#panelUsuarios .usuarios-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  margin: 14px 0 8px;
}

#panelUsuarios .usuarios-toolbar input {
  min-height: 52px;
  padding: 0 18px;
  border-radius: 16px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.06), transparent 38%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.94), rgba(3, 14, 21, 0.86));
}

#panelUsuarios .usuarios-toolbar input::placeholder {
  color: #7f95a0;
}

#panelUsuarios .usuarios-filtros {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

#panelUsuarios .usuarios-filtro {
  min-height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  border-color: rgba(83, 200, 255, 0.16);
  color: #c8d5dc;
}

#panelUsuarios .usuarios-filtro.is-active {
  color: #06121a;
  background: linear-gradient(135deg, #43d3a8, #5bbdff);
  border-color: transparent;
  box-shadow: 0 12px 30px rgba(46, 193, 159, 0.18);
}

#panelUsuarios .usuarios-form-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
  margin-top: 10px;
}

#panelUsuarios .usuarios-campos {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 14px;
}

#panelUsuarios .usuarios-campos label {
  grid-column: span 2;
  margin-top: 2px;
  margin-bottom: -6px;
  color: #9cb0b9;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

#panelUsuarios .usuarios-campos input,
#panelUsuarios .usuarios-campos select {
  grid-column: span 2;
  min-height: 48px;
  border-color: rgba(83, 200, 255, 0.12);
  border-radius: 16px;
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.06), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.88), rgba(3, 14, 21, 0.68));
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.22),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

#panelUsuarios .usuarios-form-acciones {
  display: flex;
  gap: 12px;
  grid-column: span 2;
  flex-wrap: wrap;
  margin-top: 4px;
}

#panelUsuarios .usuarios-panel-nota {
  padding: 18px;
  border-radius: 18px;
  border: 1px solid rgba(83, 200, 255, 0.1);
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.05), transparent 40%),
    rgba(3, 14, 21, 0.62);
}

#panelUsuarios .usuarios-panel-nota h4 {
  margin: 0 0 10px;
  color: var(--color-text);
  font-size: 18px;
  letter-spacing: -0.04em;
}

#panelUsuarios .usuarios-panel-nota ul {
  margin: 0;
  padding-left: 18px;
  color: #9cb0b9;
  line-height: 1.6;
}

#panelUsuarios .usuarios-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 18px;
  margin-top: 16px;
}

#panelUsuarios .usuario-card {
  position: relative;
  display: grid;
  gap: 14px;
  padding: 18px;
  border-radius: 20px;
  border: 1px solid rgba(83, 200, 255, 0.11);
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.05), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.9), rgba(3, 14, 21, 0.72));
  box-shadow:
    0 14px 30px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

#panelUsuarios .usuario-card.activo {
  border-color: rgba(55, 230, 161, 0.22);
}

#panelUsuarios .usuario-card-top {
  display: flex;
  gap: 12px;
  align-items: center;
}

#panelUsuarios .usuario-card-avatar {
  width: 52px;
  height: 52px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(55, 230, 161, 0.12);
  color: #8ef0cf;
  font-size: 22px;
  font-weight: 800;
  flex: 0 0 auto;
}

#panelUsuarios .usuario-card-info {
  display: grid;
  gap: 4px;
}

#panelUsuarios .usuario-card-nombre {
  color: var(--color-text);
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.04em;
}

#panelUsuarios .usuario-card-meta,
#panelUsuarios .usuario-card-detalle {
  color: #9cb0b9;
  font-size: 13px;
  line-height: 1.45;
}

#panelUsuarios .usuario-card-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 2px;
}

#panelUsuarios .usuario-chip {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

#panelUsuarios .usuario-chip-rol {
  color: #a6ebd2;
  background: rgba(55, 230, 161, 0.08);
  border: 1px solid rgba(55, 230, 161, 0.16);
}

#panelUsuarios .usuario-chip-activo {
  color: #6ae6b9;
  background: rgba(55, 230, 161, 0.1);
  border: 1px solid rgba(55, 230, 161, 0.16);
}

#panelUsuarios .usuario-chip-equipo {
  color: #91d8ff;
  background: rgba(74, 168, 255, 0.1);
  border: 1px solid rgba(74, 168, 255, 0.18);
}

#panelUsuarios .usuario-chip-inactivo {
  color: #ff94a2;
  background: rgba(255, 107, 122, 0.08);
  border: 1px solid rgba(255, 107, 122, 0.16);
}

#panelUsuarios .usuario-card-detalle {
  display: grid;
  gap: 4px;
}

#panelUsuarios .usuario-card-acciones {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

#panelUsuarios .usuario-btn {
  min-height: 42px;
  padding: 0 14px;
  border-radius: 12px;
}

#panelUsuarios .usuario-btn-editar {
  border-color: rgba(83, 200, 255, 0.22);
}

#panelUsuarios .usuario-btn-borrar {
  border-color: rgba(255, 107, 122, 0.22);
}

#panelUsuarios .usuarios-empty {
  margin-top: 0;
}

/* ========================================================================== */
/* PIZARRA TÁCTICA                                                            */
/* ========================================================================== */

#panelPizarra .panel-headline {
  margin-bottom: 6px;
}

#panelPizarra .panel-subtitulo {
  max-width: 780px;
}

#panelPizarra .panel-hero-premium {
  margin-top: 20px;
  gap: 16px;
}

#panelPizarra .panel-hero-premium-card {
  padding: 20px 20px 18px;
  border-radius: 20px;
  border-color: rgba(83, 200, 255, 0.11);
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.1), transparent 34%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.92), rgba(3, 14, 21, 0.76));
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.035);
}

#panelPizarra .panel-hero-premium-card strong {
  font-size: 19px;
}

#panelPizarra .panel-hero-premium-card span {
  color: #93a9b4;
}

#panelPizarra .pizarra-layout {
  border-radius: 22px;
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.05), transparent 40%),
    linear-gradient(180deg, rgba(3, 17, 25, 0.86), rgba(3, 14, 21, 0.72));
}

#panelPizarra .pizarra-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: end;
  margin-bottom: 16px;
}

#panelPizarra .pizarra-toolbar .btn-pro,
#panelPizarra .pizarra-toolbar .btn-cancelar {
  min-height: 44px;
  border-radius: 14px;
}

#panelPizarra .pizarra-color,
#panelPizarra .pizarra-grosor,
#panelPizarra .pizarra-formacion {
  display: grid;
  gap: 6px;
  min-width: 130px;
}

#panelPizarra .pizarra-color label,
#panelPizarra .pizarra-grosor label,
#panelPizarra .pizarra-formacion label {
  color: #9cb0b9;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

#panelPizarra .pizarra-color input[type="color"] {
  width: 100%;
  height: 44px;
  padding: 4px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 14px;
  background: rgba(3, 14, 21, 0.7);
}

#panelPizarra .pizarra-grosor input[type="range"] {
  width: 100%;
}

#panelPizarra .pizarra-formacion select {
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 14px;
  background: rgba(3, 14, 21, 0.7);
  color: var(--color-text);
}

#panelPizarra .pizarra-guardado {
  display: grid;
  gap: 6px;
  min-width: 190px;
}

#panelPizarra .pizarra-guardado label {
  color: #9cb0b9;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

#panelPizarra .pizarra-guardado input {
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 14px;
  background: rgba(3, 14, 21, 0.7);
  color: var(--color-text);
}

#panelPizarra .pizarra-marco {
  position: relative;
  display: flex;
  justify-content: center;
  padding: 18px;
  border-radius: 24px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.04), transparent 34%),
    rgba(3, 14, 21, 0.64);
  overflow: auto;
}

#panelPizarra .pizarra-marco.modo-goma #pizarraCanvas {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32'%3E%3Cpath d='M6 18 18 6l9 9-12 12H6z' fill='%23ff9ab0' stroke='%23611f36' stroke-width='2'/%3E%3Cpath d='M6 27h9' stroke='white' stroke-width='2'/%3E%3C/svg%3E") 8 24, crosshair;
}
#panelPizarra #pizarraCanvas {
  position: relative;
  z-index: 1;
  max-width: 100%;
  height: auto;
  border-radius: 18px;
  border: 2px solid rgba(255, 255, 255, 0.12);
  box-shadow:
    0 18px 36px rgba(0, 0, 0, 0.3),
    inset 0 0 0 1px rgba(255, 255, 255, 0.04);
  touch-action: none;
}

#panelPizarra .pizarra-zona-campo {
  display: grid;
  grid-template-columns: minmax(122px, 0.22fr) minmax(0, 1fr) minmax(142px, 0.26fr);
  gap: 16px;
  align-items: start;
}

#panelPizarra .pizarra-acciones-lateral {
  display: grid;
  gap: 10px;
  position: sticky;
  top: 16px;
}

#panelPizarra .pizarra-acciones-lateral .btn-pro,
#panelPizarra .pizarra-acciones-lateral .btn-cancelar {
  width: 100%;
  min-height: 48px;
  padding: 10px 12px;
  border-radius: 14px;
  line-height: 1.2;
}

#panelPizarra .pizarra-zona-campo .pizarra-marco {
  min-width: 0;
}

@media (max-width: 1100px) {
  #panelPizarra .pizarra-zona-campo {
    grid-template-columns: 112px minmax(0, 1fr) 132px;
    gap: 12px;
  }

  #panelPizarra .pizarra-acciones-lateral .btn-pro,
  #panelPizarra .pizarra-acciones-lateral .btn-cancelar {
    padding-inline: 8px;
    font-size: 13px;
  }
}

@media (max-width: 900px) {
  #panelPizarra .pizarra-zona-campo {
    grid-template-columns: 1fr;
  }

  #panelPizarra .pizarra-acciones-lateral {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    position: static;
  }

  #panelPizarra .pizarra-acciones-izquierda {
    order: 1;
  }

  #panelPizarra .pizarra-zona-campo .pizarra-marco {
    order: 2;
  }

  #panelPizarra .pizarra-acciones-derecha {
    order: 3;
  }
}
#panelPizarra .pizarra-zona-borrado {
  display: grid;
  place-items: center;
  min-height: 72px;
  padding: 10px;
  border: 2px dashed rgba(255, 120, 142, .52);
  border-radius: 16px;
  background: rgba(255, 91, 111, .08);
  color: #ffafbd;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.3;
  text-align: center;
  transition: .16s ease;
}
#panelPizarra .pizarra-zona-borrado.activa {
  transform: scale(1.04);
  border-color: #ff7c92;
  background: rgba(255, 91, 111, .22);
  color: #fff;
}
#panelPizarra .pizarra-material {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 16px;
  background: rgba(3, 14, 21, 0.58);
}
#panelPizarra .pizarra-material > span { grid-column: 1 / -1; color: #9cb0b9; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
#panelPizarra .pizarra-material .btn-pro { min-height: 38px; padding: 7px 6px; font-size: 12px; }
#panelPizarra .pizarra-material .btn-cancelar { grid-column: 1 / -1; }
#panelPizarra .pizarra-material-capa { position: absolute; inset: 18px; z-index: 3; pointer-events: none; }
#panelPizarra .pizarra-material-item { position: absolute; transform: translate(-50%, -50%); display: grid; place-items: center; min-width: 44px; min-height: 44px; padding: 4px; border: 0; border-radius: 12px; background: rgba(3, 14, 21, .78); color: #fff; font-size: 28px; line-height: 1; cursor: grab; pointer-events: auto; box-shadow: 0 6px 14px rgba(0,0,0,.25); }
#panelPizarra .pizarra-material-item:active { cursor: grabbing; }
#panelPizarra .pizarra-material-balon,
#panelPizarra .pizarra-material-red {
  background: transparent;
  box-shadow: none;
}
#panelPizarra .pizarra-material-cono { color: #ffdb57; font-size: 36px; background: transparent; box-shadow: none; }
#panelPizarra .pizarra-material-aro { color: #ffdb57; background: transparent; font-size: 50px; box-shadow: none; }
#panelPizarra .pizarra-material-pica { color: #ff6b8a; font-size: 50px; background: transparent; box-shadow: none; }
#panelPizarra .pizarra-material-escalera { color: #fff; font-size: 38px; }
#panelPizarra .pizarra-material-red { color: #fff; min-width: 90px; background: rgba(15, 50, 60, .72); font-size: 38px; }
#panelPizarra .pizarra-material-zona { min-width: 112px; min-height: 66px; border: 2px dashed #56c7ff; border-radius: 10px; background: rgba(86, 199, 255, .22); color: #e8f6ff; font-size: 13px; font-weight: 800; }
#panelPizarra .pizarra-cronometro { display: grid; gap: 4px; min-width: 170px; padding: 8px 10px; border: 1px solid rgba(83,200,255,.14); border-radius: 14px; background: rgba(3,14,21,.58); }
#panelPizarra .pizarra-cronometro span { color: #9cb0b9; font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
#panelPizarra .pizarra-cronometro strong { font-size: 24px; color: #8ef0cf; letter-spacing: .05em; }
#panelPizarra .pizarra-cronometro div { display: flex; gap: 7px; }
#panelPizarra .pizarra-cronometro .btn-pro { min-height: 34px; padding: 6px 10px; font-size: 12px; }
#panelPizarra .pizarra-biblioteca {
  margin-top: 18px;
  padding: 18px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 22px;
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.04), transparent 34%),
    rgba(3, 14, 21, 0.64);
}

#panelPizarra .pizarra-biblioteca-head {
  display: flex;
  gap: 14px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
  flex-wrap: wrap;
}

#panelPizarra .pizarra-biblioteca-acciones {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

#panelPizarra .pizarra-biblioteca-chip {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 999px;
  background: rgba(3, 14, 21, 0.56);
  color: #dff4fb;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.02em;
}

#panelPizarra .pizarra-biblioteca-chip-suave {
  color: #93a9b4;
  border-color: rgba(83, 200, 255, 0.08);
}

#panelPizarra .pizarra-biblioteca-head strong {
  display: block;
  color: var(--color-text);
  font-size: 18px;
  font-weight: 800;
}

#panelPizarra .pizarra-biblioteca-head p {
  margin: 6px 0 0;
  color: #93a9b4;
}

#panelPizarra .pizarra-biblioteca-row {
  display: grid;
  grid-template-columns: minmax(240px, 0.9fr) minmax(0, 1fr) auto auto auto;
  gap: 12px;
  align-items: center;
}

#panelPizarra .pizarra-biblioteca-row input {
  min-height: 46px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 14px;
  background: rgba(3, 14, 21, 0.7);
  color: var(--color-text);
  padding: 0 14px;
}

#panelPizarra .pizarra-biblioteca-row input::placeholder {
  color: #7f95a0;
}

#panelPizarra .pizarra-biblioteca-row select {
  min-height: 46px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 14px;
  background: rgba(3, 14, 21, 0.7);
  color: var(--color-text);
  padding: 0 14px;
}

#panelPizarra .pizarra-guardados-lista {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

#panelPizarra .pizarra-guardado-item {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.06), transparent 36%),
    rgba(255, 255, 255, 0.03);
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.02);
  color: var(--color-text);
  text-align: left;
  transition:
    transform 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    background 0.2s ease;
}

#panelPizarra .pizarra-guardado-item:hover {
  transform: translateY(-2px);
  border-color: rgba(83, 200, 255, 0.26);
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.09), transparent 36%),
    rgba(255, 255, 255, 0.04);
  box-shadow:
    0 18px 42px rgba(0, 0, 0, 0.28),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

#panelPizarra .pizarra-guardado-miniatura {
  width: 120px;
  height: 80px;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background-color: rgba(3, 14, 21, 0.76);
  background-size: cover;
  background-position: center;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.03),
    0 8px 18px rgba(0, 0, 0, 0.18);
}

#panelPizarra .pizarra-guardado-texto {
  display: grid;
  gap: 5px;
  min-width: 0;
}

#panelPizarra .pizarra-guardado-texto strong {
  line-height: 1.2;
}

#panelPizarra .pizarra-guardado-item strong {
  font-size: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#panelPizarra .pizarra-guardado-item span {
  color: #93a9b4;
  font-size: 12px;
}

#panelPizarra .pizarra-guardado-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid rgba(55, 230, 161, 0.16);
  border-radius: 999px;
  background: rgba(55, 230, 161, 0.08);
  color: #8ef0cf;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

#panelPizarra .pizarra-guardados-vacio {
  padding: 14px 16px;
  border: 1px dashed rgba(83, 200, 255, 0.16);
  border-radius: 16px;
  color: #93a9b4;
  background: rgba(255, 255, 255, 0.02);
}

#panelPizarra .pizarra-anotaciones {
  display: grid;
  gap: 12px;
  padding: 18px;
  border-radius: 24px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  background:
    radial-gradient(circle at top right, rgba(103, 191, 240, 0.06), transparent 32%),
    rgba(255, 255, 255, 0.03);
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}

#panelPizarra .pizarra-anotaciones-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

#panelPizarra .pizarra-anotaciones-head strong {
  font-size: 16px;
  color: var(--color-text);
}

#panelPizarra .pizarra-anotaciones-head p {
  margin: 0;
  color: #93a9b4;
  font-size: 12px;
  line-height: 1.5;
}

#panelPizarra .pizarra-anotaciones-lista {
  display: grid;
  gap: 10px;
}

#panelPizarra .pizarra-anotacion-item {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  background: rgba(3, 14, 21, 0.74);
}

#panelPizarra .pizarra-anotacion-item strong {
  color: var(--color-text);
  font-size: 14px;
}

#panelPizarra .pizarra-anotacion-item span {
  color: #93a9b4;
  font-size: 12px;
}

#panelPizarra .pizarra-anotacion-tipo {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid rgba(93, 227, 255, 0.18);
  background: rgba(66, 173, 233, 0.12);
  color: #8ddcff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

#panelPizarra .pizarra-anotaciones-vacio {
  padding: 14px 16px;
  border: 1px dashed rgba(83, 200, 255, 0.16);
  border-radius: 16px;
  color: #93a9b4;
  background: rgba(255, 255, 255, 0.02);
}

#panelPizarra .pizarra-jugadores {
  position: absolute;
  inset: 18px;
  z-index: 4;
  pointer-events: none;
}

#panelPizarra .pizarra-numeros-zonas {
  position: absolute;
  inset: 18px;
  z-index: 2;
  pointer-events: none;
  color: rgba(255, 255, 255, 0.88);
  font-size: clamp(28px, 4vw, 46px);
  font-weight: 800;
  text-shadow: 0 2px 8px rgba(55, 25, 0, 0.42);
}

#panelPizarra .pizarra-numeros-zonas span {
  position: absolute;
  transform: translate(-50%, -50%);
}

#panelPizarra .pizarra-numeros-zonas .zona-4 { left: 22%; top: 58%; }
#panelPizarra .pizarra-numeros-zonas .zona-3 { left: 50%; top: 58%; }
#panelPizarra .pizarra-numeros-zonas .zona-2 { left: 78%; top: 58%; }
#panelPizarra .pizarra-numeros-zonas .zona-5 { left: 22%; top: 88%; }
#panelPizarra .pizarra-numeros-zonas .zona-6 { left: 50%; top: 88%; }
#panelPizarra .pizarra-numeros-zonas .zona-1 { left: 78%; top: 88%; }

#panelPizarra .pizarra-jugador {
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  position: absolute;
  transform: translate(-50%, -50%);
  min-width: 52px;
  min-height: 52px;
  padding: 0 14px;
  border: 2px solid rgba(255, 255, 255, 0.85);
  border-radius: 999px;
  background: rgba(6, 18, 26, 0.92);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.04em;
  box-shadow:
    0 10px 22px rgba(0, 0, 0, 0.24),
    0 0 16px rgba(83, 200, 255, 0.14);
  cursor: grab;
  pointer-events: auto;
}

#panelPizarra .pizarra-jugador.activo {
  border-color: #8ef0cf;
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.3),
    0 0 18px rgba(55, 230, 161, 0.32);
}

#panelPizarra .pizarra-jugador:active {
  cursor: grabbing;
}

/* La composición de la pizarra usa display:grid; respetamos siempre hidden al plegar el historial. */
#panelPizarra .pizarra-anotaciones[hidden] {
  display: none !important;
}

#panelPizarra .pizarra-editor-jugador {
  display: grid;
  gap: 18px;
  margin-top: 20px;
  padding: 20px;
  border: 1px solid rgba(83, 200, 255, 0.2);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(11, 34, 47, 0.96), rgba(5, 17, 26, 0.98));
}

#panelPizarra .pizarra-editor-jugador[hidden] { display: none; }
#panelPizarra .pizarra-editor-jugador-etiqueta { display: block; color: #8ef0cf; font-size: 0.74rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
#panelPizarra .pizarra-editor-jugador strong { display: block; margin-top: 4px; font-size: 1.15rem; }
#panelPizarra .pizarra-editor-jugador p { margin: 6px 0 0; color: var(--color-text-muted); }
#panelPizarra .pizarra-editor-jugador-campos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
#panelPizarra .pizarra-editor-jugador label { display: grid; gap: 6px; color: var(--color-text-muted); font-size: .82rem; font-weight: 700; }
#panelPizarra .pizarra-editor-jugador input,
#panelPizarra .pizarra-editor-jugador select { min-width: 0; }
#panelPizarra .pizarra-editor-jugador-acciones { display: flex; flex-wrap: wrap; gap: 10px; }

@media (max-width: 780px) {
  #panelPizarra .pizarra-editor-jugador-campos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

#panelPizarra .btn-secundario[aria-pressed="true"] {
  border-color: rgba(55, 230, 161, 0.26);
  background: rgba(55, 230, 161, 0.12);
  color: #8ef0cf;
}

@media (max-width: 1100px) {
  #panelPizarra .pizarra-marco.modo-goma #pizarraCanvas {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32'%3E%3Cpath d='M6 18 18 6l9 9-12 12H6z' fill='%23ff9ab0' stroke='%23611f36' stroke-width='2'/%3E%3Cpath d='M6 27h9' stroke='white' stroke-width='2'/%3E%3C/svg%3E") 8 24, crosshair;
}
#panelPizarra #pizarraCanvas {
    width: 100%;
    min-width: 620px;
  }

  #panelPizarra .pizarra-biblioteca-row {
    grid-template-columns: 1fr;
  }

  .sesiones-toolbar {
    grid-template-columns: 1fr;
  }

  #panelPizarra .pizarra-biblioteca-head {
    flex-direction: column;
    align-items: flex-start;
  }

  #panelPizarra .pizarra-guardado-item {
    grid-template-columns: 96px minmax(0, 1fr);
  }

  #panelPizarra .pizarra-guardado-badge {
    grid-column: 1 / -1;
    justify-self: start;
  }

  #panelPizarra .pizarra-guardado-miniatura {
    width: 96px;
    height: 66px;
  }
}

@media (max-width: 1200px) {
  #panelUsuarios .usuarios-form-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  #panelUsuarios .usuarios-campos {
    grid-template-columns: 1fr;
  }

  #panelUsuarios .usuarios-campos label,
  #panelUsuarios .usuarios-campos input,
  #panelUsuarios .usuarios-campos select,
  #panelUsuarios .usuarios-form-acciones {
    grid-column: auto;
  }

  #panelUsuarios .usuarios-toolbar {
    gap: 10px;
  }
}

@media (max-width: 900px) {
  body {
    overflow: auto;
  }

  body::before {
    opacity: 0.42;
    filter: blur(0);
  }

  #sidebarToggle {
    position: fixed;
    top: calc(12px + env(safe-area-inset-top));
    left: calc(12px + env(safe-area-inset-left));
    z-index: 1200;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    padding: 0;
    border: 1px solid rgba(83, 200, 255, 0.16);
    border-radius: 14px;
    background: rgba(6, 17, 25, 0.88);
    color: var(--color-text);
    box-shadow: 0 14px 32px rgba(0, 0, 0, 0.34);
    backdrop-filter: blur(14px);
  }

  #sidebarToggle svg {
    width: 24px;
    height: 24px;
    fill: currentColor;
  }

  .sidebar-overlay {
    position: fixed;
    inset: 0;
    z-index: 1090;
    background: rgba(2, 7, 10, 0.62);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease;
  }

  .sidebar-overlay.visible {
    opacity: 1;
    pointer-events: auto;
  }

  body.sidebar-mobile-closing .sidebar-overlay {
    opacity: 0;
    pointer-events: none;
  }

  body.sidebar-mobile-forzado-cerrado .sidebar-overlay {
    opacity: 0 !important;
    pointer-events: none !important;
  }

  #sidebar {
    width: min(86vw, 320px);
    box-sizing: border-box;
    height: 100dvh;
    padding-top: calc(76px + env(safe-area-inset-top));
    transform: translateX(-110%);
    transition:
      transform 0.26s ease,
      opacity 0.26s ease;
  }

  body.sidebar-mobile-open #sidebar {
    transform: translateX(0);
  }

  body.sidebar-mobile-closing #sidebar {
    transform: translateX(-110%);
    pointer-events: none;
  }

  body.sidebar-mobile-forzado-cerrado #sidebar {
    transform: translateX(-110%) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  #contenido,
  .app-welcome {
    margin-left: 0 !important;
  }

  #contenido {
    min-height: 0;
    height: 0;
    padding: 0;
    margin-top: calc(74px + env(safe-area-inset-top));
  }

  body.sidebar-mobile-open {
    overflow: hidden;
  }

  .app-welcome {
    margin-inline: 14px;
    margin-top: 74px;
  }

  .panel {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    margin: 14px 14px 18px;
    max-height: none;
    min-height: auto;
    overflow: visible;
    padding: 18px 14px 22px;
    opacity: 1;
    transform: none;
    pointer-events: auto;
    display: none;
  }

  .panel.visible {
    display: block;
  }

  body.sidebar-mobile-open .panel.visible,
  body.sidebar-mobile-closing .panel.visible {
    z-index: 1300;
  }

  body.sidebar-mobile-forzado-cerrado .panel.visible {
    z-index: 1;
  }

  .panel-headline {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .panel-headline h2 {
    font-size: clamp(26px, 8vw, 36px);
    line-height: 0.95;
  }

  .panel-hero-premium,
  .panel-hero-equipos,
  .panel-hero-jugadoras,
  .panel-hero-lista,
  .panel-hero-dashboard,
  .panel-hero-estadisticas,
  .dashboard-grid,
  .dashboard-graficos,
  .estadisticas-graficos,
  .usuarios-form-grid,
  .entrenamiento-layout {
    grid-template-columns: 1fr !important;
  }

  .listaJugadoras,
  .usuarios-grid,
  .dashboard-grid {
    grid-template-columns: 1fr !important;
  }

  .accionesJugadoras,
  .dashboard-toolbar,
  .estadisticas-toolbar,
  .pizarra-biblioteca-row,
  .pizarra-toolbar {
    grid-template-columns: 1fr !important;
  }

  .panel-hero-premium-card,
  .sesiones-hero-premium-card,
  .entrenamiento-proxima-sesion,
  .dashboard-card,
  .jugadora-card,
  .item-asistencia,
  .sesion-form-card,
  .sesion-seccion,
  .pizarra-biblioteca,
  .pizarra-marco,
  .usuarios-card,
  .usuarios-form-card {
    border-radius: 18px;
  }

  .panel-hero-premium-card,
  .sesiones-hero-premium-card {
    padding: 18px 16px;
    min-height: 128px;
  }

  .panel-hero-premium-card strong,
  .sesiones-hero-premium-card strong {
    font-size: clamp(18px, 4.6vw, 22px);
  }

  .panel-hero-premium-card span,
  .sesiones-hero-premium-card span {
    font-size: 0.92rem;
    line-height: 1.45;
  }

  .dashboard-card,
  .sesiones-resumen-premium-card,
  .entrenamiento-proxima-sesion,
  .panel-resumen-premium-card,
  .usuarios-card,
  .jugadora-card,
  .item-asistencia {
    padding: 16px 14px;
  }

  .dashboard-card p,
  .sesiones-resumen-premium-card span,
  .entrenamiento-proxima-sesion p,
  .jugadora-card .jugadora-detalles,
  .item-asistencia .asistencia-datos span {
    line-height: 1.45;
  }

  .panel button,
  .panel .btn-pro,
  .panel .btn-secundario,
  .panel input,
  .panel select,
  .panel textarea {
    max-width: 100%;
  }

  .panel .btn-pro,
  .panel .btn-secundario,
  .panel .btn-cancelar,
  .panel .btn-editar,
  .panel .btn-eliminar,
  .panel .btn-primary,
  .panel .btn-outline {
    width: 100%;
  }

  .pizarra-toolbar,
  .pizarra-biblioteca-row,
  .usuarios-form-acciones {
    display: grid;
  }

  .pizarra-marco {
    padding: 12px;
  }

  #panelPizarra .pizarra-marco.modo-goma #pizarraCanvas {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32'%3E%3Cpath d='M6 18 18 6l9 9-12 12H6z' fill='%23ff9ab0' stroke='%23611f36' stroke-width='2'/%3E%3Cpath d='M6 27h9' stroke='white' stroke-width='2'/%3E%3C/svg%3E") 8 24, crosshair;
}
#panelPizarra #pizarraCanvas {
    min-width: 0;
    width: 100%;
  }

  #panelPizarra .pizarra-jugadores {
    inset: 12px;
  }

  .dashboard-toolbar,
  .estadisticas-toolbar {
    align-items: stretch;
  }

  .dashboard-toolbar label,
  .estadisticas-toolbar label,
  .pizarra-toolbar label,
  .pizarra-biblioteca-head p,
  .panel-subtitulo,
  .app-welcome p {
    font-size: 0.94rem;
    line-height: 1.45;
  }

  .app-welcome {
    display: none;
  }

  .panel-hero-premium,
  .sesiones-hero-premium {
    gap: 12px;
  }

  .panel-hero-premium-card::after,
  .sesiones-hero-premium-card::after {
    inset: auto 0 -32px auto;
    opacity: 0.18;
  }

  #panelPizarra .pizarra-toolbar,
  #panelPizarra .pizarra-biblioteca-row,
  #panelPizarra .pizarra-jugadores {
    gap: 10px;
  }

  #panelPizarra .pizarra-jugador {
    width: 38px;
    height: 38px;
    font-size: 0.72rem;
  }

  #panelLista .asistencia-cabecera,
  #panelLista .asistencia-resumen,
  #panelLista .asistencia-footer {
    gap: 10px;
  }
}

@media (min-width: 901px) {
  #sidebarToggle,
  .sidebar-overlay {
    display: none !important;
  }
}


/* Ficha aislada de sesión: no modifica la estructura del panel existente. */
#panelSesiones.sesiones-detalle-activa > :not(#sesionesDetalleVista) {
  display: none !important;
}

.sesiones-detalle-vista {
  display: grid;
  gap: 18px;
  animation: sesionesDetalleEntrada 200ms ease both;
}

.sesiones-detalle-vista[hidden] {
  display: none !important;
}

.sesiones-detalle-cabecera,
.sesiones-detalle-resumen,
.sesiones-detalle-plan {
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 24px;
  background: linear-gradient(160deg, rgba(5, 28, 39, 0.9), rgba(3, 14, 21, 0.76));
}

.sesiones-detalle-cabecera {
  display: grid;
  gap: 10px;
  padding: 26px 28px;
}

.sesiones-detalle-cabecera .btn-pro {
  width: fit-content;
}

.sesiones-detalle-etiqueta,
.sesiones-detalle-equipo,
.sesiones-detalle-plan-titulo span {
  color: var(--color-primary);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sesiones-detalle-cabecera h2,
.sesiones-detalle-resumen h3 {
  margin: 0;
}

.sesiones-detalle-cabecera h2 {
  font-size: clamp(28px, 3vw, 40px);
}

.sesiones-detalle-cabecera p,
.sesiones-detalle-fecha,
.sesiones-detalle-bloque p,
.sesiones-detalle-vacio {
  margin: 0;
  color: var(--color-text-muted);
  line-height: 1.55;
}

.sesiones-detalle-resumen {
  display: grid;
  gap: 12px;
  padding: 30px;
  border-color: rgba(55, 230, 161, 0.2);
  background:
    radial-gradient(circle at 90% 12%, rgba(55, 230, 161, 0.14), transparent 32%),
    linear-gradient(160deg, rgba(5, 35, 42, 0.92), rgba(3, 14, 21, 0.8));
}

.sesiones-detalle-resumen h3 {
  font-size: clamp(26px, 3vw, 38px);
}

.sesiones-detalle-metricas,
.sesiones-detalle-acciones,
.sesiones-detalle-recursos {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.sesiones-detalle-metricas span,
.sesiones-detalle-bloque > div > span {
  display: inline-flex;
  align-items: center;
  min-height: 31px;
  padding: 0 11px;
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 999px;
  background: rgba(3, 14, 21, 0.54);
  font-size: 12px;
  font-weight: 700;
}

.sesiones-detalle-plan {
  padding: 26px;
}

.sesiones-detalle-plan-titulo {
  display: grid;
  gap: 4px;
  margin-bottom: 18px;
}

.sesiones-detalle-plan-titulo strong {
  font-size: 22px;
}

#sesionesDetalleBloques {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.sesiones-detalle-bloque {
  display: grid;
  gap: 13px;
  min-height: 145px;
  padding: 20px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 18px;
  background: rgba(3, 14, 21, 0.52);
}

.sesiones-detalle-bloque > div:first-child {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.sesiones-detalle-bloque h4 {
  margin: 0;
  font-size: 18px;
}

.sesiones-detalle-recurso {
  min-height: 38px;
  padding: 0 12px;
  border: 1px solid rgba(55, 230, 161, 0.18);
  border-radius: 10px;
  background: rgba(55, 230, 161, 0.08);
  color: #a8f5d7;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

#listaSesiones .item-lista {
  cursor: pointer;
}

#listaSesiones .item-lista:focus-visible {
  outline: 3px solid rgba(83, 200, 255, 0.45);
  outline-offset: 3px;
}

@keyframes sesionesDetalleEntrada {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 760px) {
  .sesiones-detalle-cabecera,
  .sesiones-detalle-resumen,
  .sesiones-detalle-plan {
    padding: 20px;
  }

  #sesionesDetalleBloques {
    grid-template-columns: 1fr;
  }

  .sesiones-detalle-cabecera .btn-pro,
  .sesiones-detalle-acciones .btn-pro {
    width: 100%;
  }
}

/* Perfil individual de jugador sin alterar el listado de plantilla. */
#panelJugadoras.jugadora-detalle-activa > :not(#jugadoraDetalleVista) {
  display: none !important;
}

.jugadora-detalle-vista {
  display: grid;
  gap: 18px;
  animation: jugadoraDetalleEntrada 200ms ease both;
}

.jugadora-detalle-cabecera,
.jugadora-detalle-hero,
.jugadora-detalle-datos {
  border: 1px solid rgba(83, 200, 255, 0.14);
  border-radius: 24px;
  background: linear-gradient(160deg, rgba(5, 28, 39, 0.9), rgba(3, 14, 21, 0.76));
}

.jugadora-detalle-cabecera {
  display: grid;
  gap: 10px;
  padding: 26px 28px;
}

.jugadora-detalle-cabecera .btn-pro {
  width: fit-content;
}

.jugadora-detalle-cabecera > span,
.jugadora-detalle-equipo {
  color: var(--color-primary);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.jugadora-detalle-cabecera h2,
.jugadora-detalle-identidad h3 {
  margin: 0;
}

.jugadora-detalle-cabecera h2 {
  font-size: clamp(28px, 3vw, 40px);
}

.jugadora-detalle-cabecera p,
.jugadora-detalle-posicion {
  margin: 0;
  color: var(--color-text-muted);
  line-height: 1.55;
}

.jugadora-detalle-hero {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  align-items: center;
  gap: 28px;
  padding: 30px;
  border-color: rgba(55, 230, 161, 0.2);
  background:
    radial-gradient(circle at 88% 15%, rgba(55, 230, 161, 0.14), transparent 30%),
    linear-gradient(160deg, rgba(5, 35, 42, 0.92), rgba(3, 14, 21, 0.8));
}

.jugadora-detalle-foto {
  display: grid;
  width: 180px;
  height: 180px;
  place-items: center;
  overflow: hidden;
  border: 3px solid var(--color-primary);
  border-radius: 50%;
  background-position: center;
  background-size: cover;
  box-shadow: 0 0 0 8px rgba(55, 230, 161, 0.08), 0 18px 34px rgba(0, 0, 0, 0.28);
}

.jugadora-detalle-foto.sin-foto {
  background: radial-gradient(circle at 32% 28%, rgba(83, 200, 255, 0.26), transparent 35%), #09202b;
  color: var(--color-accent);
}

.jugadora-detalle-foto svg {
  width: 76px;
  height: 76px;
  fill: currentColor;
}

.jugadora-detalle-identidad {
  display: grid;
  gap: 9px;
}

.jugadora-detalle-identidad h3 {
  font-size: clamp(26px, 3vw, 38px);
}

.jugadora-detalle-acciones {
  margin-top: 10px;
}

.jugadora-detalle-datos {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  background: rgba(83, 200, 255, 0.12);
}

.jugadora-detalle-datos > div {
  display: grid;
  gap: 7px;
  min-height: 118px;
  padding: 22px;
  align-content: center;
  background: rgba(3, 14, 21, 0.78);
}

.jugadora-detalle-datos span {
  color: var(--color-text-muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.jugadora-detalle-datos strong {
  font-size: 24px;
}

#listaJugadoras .jugadora-card {
  cursor: pointer;
}

#listaJugadoras .jugadora-card:focus-visible {
  outline: 3px solid rgba(83, 200, 255, 0.45);
  outline-offset: 3px;
}

@keyframes jugadoraDetalleEntrada {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 760px) {
  .jugadora-detalle-cabecera,
  .jugadora-detalle-hero {
    padding: 20px;
  }

  .jugadora-detalle-hero {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
  }

  .jugadora-detalle-identidad,
  .jugadora-detalle-acciones {
    justify-items: center;
  }

  .jugadora-detalle-datos {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .jugadora-detalle-cabecera .btn-pro,
  .jugadora-detalle-acciones .btn-pro {
    width: 100%;
  }
}

/* Edición de jugador: se aprovecha la columna libre con un resumen de rendimiento. */
#panelNuevaJugadora .form-grid {
  grid-template-columns: minmax(210px, 250px) minmax(330px, 1fr) minmax(250px, 0.72fr);
  gap: clamp(22px, 3vw, 42px);
}

#panelNuevaJugadora .form-campos {
  grid-template-columns: 1fr;
  gap: 9px;
}

#panelNuevaJugadora .form-campos label {
  grid-column: auto;
}

.jugadora-edicion-resumen {
  display: grid;
  align-content: start;
  gap: 11px;
  min-height: 310px;
  padding: 22px;
  border: 1px solid rgba(55, 230, 161, 0.2);
  border-radius: 22px;
  background:
    radial-gradient(circle at top right, rgba(55, 230, 161, 0.13), transparent 36%),
    linear-gradient(160deg, rgba(5, 31, 39, 0.92), rgba(3, 14, 21, 0.72));
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.24);
}

.jugadora-edicion-etiqueta {
  color: var(--color-primary);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.jugadora-edicion-resumen h3,
.jugadora-edicion-resumen p {
  margin: 0;
}

.jugadora-edicion-resumen h3 {
  font-size: 23px;
  line-height: 1.12;
}

.jugadora-edicion-resumen p {
  color: var(--color-text-muted);
  text-transform: capitalize;
}

.jugadora-edicion-metricas {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 7px;
}

.jugadora-edicion-metricas > div {
  display: grid;
  gap: 5px;
  min-height: 82px;
  padding: 13px;
  align-content: center;
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 14px;
  background: rgba(3, 14, 21, 0.58);
}

.jugadora-edicion-metricas span {
  color: var(--color-text-muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.jugadora-edicion-metricas strong {
  overflow: hidden;
  color: var(--color-text);
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Plantilla más expresiva, conservando la misma altura de tarjetas. */
#panelJugadoras .jugadora-card {
  min-height: 172px;
  padding: 20px;
}

#panelJugadoras .jugadora-card .jugadora-info {
  min-width: 0;
  gap: 7px;
  padding-top: 2px;
}

#panelJugadoras .jugadora-nombre {
  font-size: clamp(19px, 1.3vw, 23px);
  line-height: 1.08;
}

#panelJugadoras .jugadora-card .jugadora-equipo {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.04em;
}

#panelJugadoras .jugadora-detalles {
  gap: 9px 13px;
  font-size: 15px;
}

#panelJugadoras .jugadora-card .jugadora-detalles span {
  min-height: 28px;
  padding: 0 9px;
  border: 1px solid rgba(83, 200, 255, 0.1);
  border-radius: 999px;
  background: rgba(3, 14, 21, 0.36);
}

#panelJugadoras .jugadora-foto {
  width: 82px;
  height: 82px;
}

#panelJugadoras .jugadora-card .jugadora-acciones {
  gap: 10px;
}

#panelJugadoras .jugadora-card .btn-accion {
  width: 50px;
  height: 50px;
}

@media (max-width: 1120px) {
  #panelNuevaJugadora .form-grid {
    grid-template-columns: minmax(210px, 250px) minmax(320px, 1fr);
  }

  .jugadora-edicion-resumen {
    grid-column: 1 / -1;
    min-height: auto;
  }
}

@media (max-width: 720px) {
  #panelNuevaJugadora .form-grid {
    grid-template-columns: 1fr;
  }

  #panelNuevaJugadora .form-foto {
    align-items: center;
  }

  .jugadora-edicion-resumen {
    grid-column: auto;
  }
}

/* Detalle de equipo aislado para mantener el listado principal limpio. */
#panelEquipos.equipo-detalle-activa > :not(#equipoDetalleVista) { display: none !important; }
.equipo-detalle-vista { display: grid; gap: 18px; animation: equipoDetalleEntrada 200ms ease both; }
.equipo-detalle-cabecera, .equipo-detalle-hero, .equipo-detalle-grid > section { border: 1px solid rgba(83, 200, 255, 0.14); border-radius: 24px; background: linear-gradient(160deg, rgba(5, 28, 39, 0.9), rgba(3, 14, 21, 0.76)); }
.equipo-detalle-cabecera { display: grid; gap: 10px; padding: 26px 28px; }
.equipo-detalle-cabecera .btn-pro { width: fit-content; }
.equipo-detalle-cabecera > span, .equipo-detalle-hero > div > span, .equipo-detalle-titulo span { color: var(--color-primary); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.equipo-detalle-cabecera h2, .equipo-detalle-hero h3 { margin: 0; }
.equipo-detalle-cabecera h2 { font-size: clamp(28px, 3vw, 40px); }
.equipo-detalle-cabecera p { margin: 0; color: var(--color-text-muted); line-height: 1.55; }
.equipo-detalle-hero { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 28px; align-items: center; padding: 30px; border-color: rgba(55, 230, 161, .2); background: radial-gradient(circle at 88% 15%, rgba(55,230,161,.14), transparent 30%), linear-gradient(160deg, rgba(5,35,42,.92), rgba(3,14,21,.8)); }
.equipo-detalle-icono { display: grid; width: 140px; height: 140px; place-items: center; border: 2px solid var(--color-primary); border-radius: 32px; color: var(--color-accent); background: rgba(3,14,21,.55); box-shadow: 0 0 0 8px rgba(55,230,161,.07); }
.equipo-detalle-icono svg { width: 68px; height: 68px; fill: currentColor; }
.equipo-detalle-hero h3 { margin: 7px 0 12px; font-size: clamp(26px, 3vw, 38px); }
.equipo-detalle-metricas { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.equipo-detalle-metricas span { display: inline-flex; min-height: 31px; align-items: center; padding: 0 11px; border: 1px solid rgba(83,200,255,.14); border-radius: 999px; background: rgba(3,14,21,.52); font-size: 12px; font-weight: 700; }
.equipo-detalle-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.equipo-detalle-grid > section { padding: 24px; }
.equipo-detalle-titulo { display: grid; gap: 4px; margin-bottom: 16px; }
.equipo-detalle-titulo strong { font-size: 21px; }
.equipo-detalle-lista { display: grid; gap: 10px; }
.equipo-detalle-item { display: grid; gap: 4px; padding: 14px; border: 1px solid rgba(83,200,255,.1); border-radius: 14px; background: rgba(3,14,21,.48); }
.equipo-detalle-item span, .equipo-detalle-vacio { color: var(--color-text-muted); }
.equipo-detalle-vacio { margin: 0; line-height: 1.55; }
#listaEquipos .equipo-card { cursor: pointer; }
#listaEquipos .equipo-card:focus-visible { outline: 3px solid rgba(83,200,255,.45); outline-offset: 3px; }
@keyframes equipoDetalleEntrada { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 760px) { .equipo-detalle-cabecera, .equipo-detalle-hero, .equipo-detalle-grid > section { padding: 20px; } .equipo-detalle-hero, .equipo-detalle-grid { grid-template-columns: 1fr; } .equipo-detalle-hero { justify-items: center; text-align: center; } .equipo-detalle-cabecera .btn-pro { width: 100%; } }

/* Dashboard operativo: orienta la acción después de la lectura de datos. */
#panelDashboard .dashboard-siguiente-accion {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  margin: 18px 0;
  padding: 22px 24px;
  border: 1px solid rgba(55, 230, 161, 0.18);
  border-radius: 20px;
  background:
    radial-gradient(circle at 88% 20%, rgba(55, 230, 161, 0.12), transparent 30%),
    linear-gradient(150deg, rgba(4, 31, 39, 0.9), rgba(3, 14, 21, 0.72));
}

#panelDashboard .dashboard-siguiente-accion > div:first-child {
  display: grid;
  gap: 5px;
}

#panelDashboard .dashboard-siguiente-accion span {
  color: var(--color-primary);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#panelDashboard .dashboard-siguiente-accion strong {
  font-size: 21px;
}

#panelDashboard .dashboard-siguiente-accion p {
  margin: 0;
  color: var(--color-text-muted);
}

#panelDashboard .dashboard-atajos {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

#panelDashboard .dashboard-atajos .btn-pro {
  min-width: 142px;
}

@media (max-width: 960px) {
  #panelDashboard .dashboard-siguiente-accion {
    align-items: stretch;
    flex-direction: column;
  }

  #panelDashboard .dashboard-atajos {
    justify-content: flex-start;
  }
}

@media (max-width: 620px) {
  #panelDashboard .dashboard-atajos .btn-pro {
    width: 100%;
  }
}

/* ===========================
   THEME PREMIUM 2.0
   Override visual al final del archivo.
=========================== */

:root {
  --theme-bg-0: #050b12;
  --theme-bg-1: #07131d;
  --theme-surface: rgba(8, 18, 28, 0.72);
  --theme-surface-strong: rgba(10, 22, 35, 0.9);
  --theme-border: rgba(151, 189, 207, 0.14);
  --theme-border-strong: rgba(118, 220, 255, 0.22);
  --theme-text: #eff7fb;
  --theme-muted: #a6bac7;
  --theme-primary: #56dca1;
  --theme-secondary: #68c7ff;
  --theme-accent: #c6f36d;
}

html {
  background:
    radial-gradient(circle at top, rgba(104, 199, 255, 0.1), transparent 32%),
    radial-gradient(circle at 80% 0%, rgba(86, 220, 161, 0.08), transparent 28%),
    linear-gradient(180deg, var(--theme-bg-1), var(--theme-bg-0));
}

body {
  font-family: "Segoe UI Variable", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  color: var(--theme-text);
  background:
    radial-gradient(circle at 18% 18%, rgba(104, 199, 255, 0.1), transparent 20%),
    radial-gradient(circle at 82% 0%, rgba(86, 220, 161, 0.08), transparent 18%),
    linear-gradient(180deg, var(--theme-bg-1), var(--theme-bg-0)) !important;
}

#startupSplash {
  background:
    radial-gradient(circle at 50% 32%, rgba(104, 199, 255, 0.18), transparent 28%),
    radial-gradient(circle at 50% 66%, rgba(86, 220, 161, 0.1), transparent 24%),
    linear-gradient(180deg, #06111a, #04090f);
}

.startup-splash-card {
  border-color: rgba(104, 199, 255, 0.18);
  background: linear-gradient(180deg, rgba(12, 26, 39, 0.96), rgba(6, 14, 21, 0.98));
}

#sidebar {
  width: 270px;
  padding: 26px 20px;
  background: linear-gradient(180deg, rgba(7, 16, 26, 0.94), rgba(5, 11, 18, 0.98));
  border-right: 1px solid rgba(255, 255, 255, 0.05);
  box-shadow: 10px 0 36px rgba(0, 0, 0, 0.34);
}

.logo {
  margin: 0 0 2px;
  font-size: 28px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#sidebarEstadoApp {
  border-color: rgba(104, 199, 255, 0.18);
  background: linear-gradient(180deg, rgba(104, 199, 255, 0.1), rgba(5, 16, 24, 0.72));
  color: var(--theme-secondary);
}

.menu-item {
  border-color: rgba(255, 255, 255, 0.05);
  background: rgba(255, 255, 255, 0.025);
  color: rgba(239, 247, 251, 0.86);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}

.menu-item:hover,
.menu-item.activo {
  background: linear-gradient(135deg, rgba(86, 220, 161, 0.16), rgba(104, 199, 255, 0.14));
  border-color: rgba(86, 220, 161, 0.24);
  color: #f7fffb;
  transform: translateX(3px);
}

#contenido {
  margin-left: 286px !important;
  padding: 24px;
}

.app-welcome {
  margin: 18px 20px 0 302px;
  border-color: rgba(104, 199, 255, 0.16);
  background:
    radial-gradient(circle at top right, rgba(104, 199, 255, 0.14), transparent 34%),
    linear-gradient(180deg, rgba(7, 16, 26, 0.94), rgba(5, 10, 16, 0.82));
}

.panel,
.bloque,
.modal-contenido,
.dashboard-card,
.stat-card,
.panel-resumen-premium-card,
.panel-hero-premium-card,
.equipo-card,
.jugadora-card,
.usuarios-card,
.pizarra-marco,
.pizarra-biblioteca,
.pizarra-anotaciones,
.entrenamiento-detalle-hero,
.entrenamiento-proxima-sesion,
.sesiones-detalle-cabecera,
.sesiones-detalle-resumen,
.sesiones-detalle-plan,
.jugadora-detalle-cabecera,
.jugadora-detalle-hero,
.jugadora-detalle-datos,
.equipo-detalle-cabecera,
.equipo-detalle-hero,
.equipo-detalle-grid > section,
.panel-hero-premium,
.usuarios-form-card,
.entrenamiento-vista-lista,
.entrenamiento-vista-detalle,
.lista-estado-entrenamiento {
  background: var(--theme-surface);
  border-color: var(--theme-border);
}

.panel {
  border-radius: 24px;
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.42);
  backdrop-filter: blur(22px) saturate(128%);
}

.panel.visible {
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.42);
}

.panel-headline h2,
.bloque h3,
.dashboard-card h3,
.stat-card .stat-title,
.jugadora-nombre,
.equipo-card-nombre,
.usuarios-card-nombre,
.entrenamiento-detalle-principal h3,
.sesiones-detalle-cabecera h2,
.sesiones-detalle-resumen h3,
.jugadora-detalle-cabecera h2,
.jugadora-detalle-identidad h3,
.equipo-detalle-cabecera h2,
.equipo-detalle-hero h3 {
  letter-spacing: -0.02em;
}

.panel-headline p,
.panel-subtitulo,
.app-welcome p,
.jugadora-detalles,
.equipo-card-stats,
.usuarios-card-meta,
.dashboard-card p,
.stat-card .stat-title,
.stat-card .stat-value,
.panel-resumen-premium-card span,
.panel-hero-premium-card span,
.entrenamiento-meta,
.entrenamiento-contenido-cabecera span,
.sesiones-detalle-fecha,
.sesiones-detalle-bloque p,
.equipo-detalle-item span,
.equipo-detalle-vacio,
.jugadora-detalle-posicion,
.jugadora-detalle-datos span,
.lista-estado-entrenamiento-metrica span {
  color: var(--theme-muted);
}

.panel-hero-premium-card,
.panel-resumen-premium-card,
.dashboard-card,
.stat-card,
.equipo-card,
.jugadora-card,
.usuarios-card,
.pizarra-guardado-item,
.entrenamiento-bloque,
.sesiones-detalle-bloque,
.equipo-detalle-item,
.asistencia-item,
.lista-estado-entrenamiento {
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(12, 24, 37, 0.82), rgba(7, 14, 22, 0.9));
}

.panel-hero-premium-card strong,
.panel-resumen-premium-card strong,
.dashboard-card p,
.stat-card .stat-value,
.equipo-card-nombre,
.jugadora-nombre,
.usuarios-card-nombre,
.entrenamiento-proxima-sesion strong,
.entrenamiento-detalle-principal h3,
.sesiones-detalle-cabecera h2,
.sesiones-detalle-resumen h3,
.jugadora-detalle-cabecera h2,
.jugadora-detalle-identidad h3,
.equipo-detalle-cabecera h2,
.equipo-detalle-hero h3 {
  color: var(--theme-text);
}

.btn-pro,
.btn-secundario,
.btn-crear,
.btn-guardar,
.btn-cancelar,
.btn-accion,
.usuarios-filtro,
.sesion-tab,
.entrenamiento-reciente-chip,
.pizarra-biblioteca-chip,
.dashboard-equipo-opcion,
.estadisticas-equipo-opcion,
.asistencia-estado-opcion,
.asistencia-motivo-opcion,
.asistencia-sesion-opcion {
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.btn-crear {
  background: linear-gradient(180deg, rgba(86, 220, 161, 0.22), rgba(86, 220, 161, 0.1));
}

.btn-guardar {
  background: linear-gradient(180deg, rgba(198, 243, 109, 0.2), rgba(198, 243, 109, 0.08));
}

.btn-cancelar {
  background: linear-gradient(180deg, rgba(255, 114, 132, 0.16), rgba(255, 114, 132, 0.08));
  color: #ffd9df;
}

.bloque input,
.bloque select,
.bloque textarea,
.usuarios-campo input,
.usuarios-campo select,
.modal-contenido input,
.modal-contenido select,
.entrenamiento-selector input,
.pizarra-biblioteca-row input,
.pizarra-biblioteca-row select,
.asistencia-sesion-trigger,
.dashboard-equipo-selector button,
.estadisticas-equipo-selector button {
  background: rgba(5, 12, 19, 0.74);
  color: var(--theme-text);
  border-color: rgba(255, 255, 255, 0.1);
  border-radius: 14px;
}

.bloque input:focus,
.bloque select:focus,
.bloque textarea:focus,
.usuarios-campo input:focus,
.usuarios-campo select:focus,
.modal-contenido input:focus,
.modal-contenido select:focus,
.entrenamiento-selector input:focus,
.pizarra-biblioteca-row input:focus,
.pizarra-biblioteca-row select:focus {
  border-color: rgba(86, 220, 161, 0.42);
  box-shadow: 0 0 0 4px rgba(86, 220, 161, 0.08);
}

.tabs-equipos,
.usuarios-toolbar,
.dashboard-toolbar,
.estadisticas-toolbar,
.pizarra-toolbar,
.pizarra-biblioteca-row,
.entrenamiento-acciones-barra,
.asistencia-footer,
.modal-acciones {
  gap: 12px;
}

.tab-equipo,
.sesion-tab,
.usuarios-filtro,
.entrenamiento-reciente-chip,
.pizarra-biblioteca-chip {
  background: rgba(255, 255, 255, 0.04);
  color: var(--theme-text);
  border-color: rgba(255, 255, 255, 0.08);
}

.tab-equipo.activa,
.sesion-tab.activa,
.usuarios-filtro.is-active,
.entrenamiento-reciente-chip.activa,
.pizarra-biblioteca-chip-suave {
  background: linear-gradient(135deg, rgba(86, 220, 161, 0.18), rgba(104, 199, 255, 0.16));
  border-color: rgba(86, 220, 161, 0.22);
}

.lista-estado-entrenamiento {
  padding: 18px 20px;
  background: linear-gradient(180deg, rgba(11, 23, 36, 0.88), rgba(7, 14, 22, 0.94));
}

.asistencia-sesion-trigger,
.dashboard-equipo-selector button,
.estadisticas-equipo-selector button {
  min-height: 42px;
  padding: 0 14px;
}

.asistencia-sesion-opcion,
.dashboard-equipo-opcion,
.estadisticas-equipo-opcion {
  background: rgba(8, 18, 28, 0.95);
  color: var(--theme-text);
}

.asistencia-sesion-opcion.activa,
.dashboard-equipo-opcion.activa,
.estadisticas-equipo-opcion.activa {
  background: linear-gradient(135deg, rgba(86, 220, 161, 0.18), rgba(104, 199, 255, 0.16));
}

.asistencia-estado-opcion[data-estado="presente"] {
  background: rgba(86, 220, 161, 0.12);
}

.asistencia-estado-opcion[data-estado="ausente"] {
  background: rgba(255, 114, 132, 0.12);
}

.asistencia-estado-opcion[data-estado="justificado"] {
  background: rgba(198, 243, 109, 0.12);
}

.jugadora-card .jugadora-detalles span,
.equipo-card-stats span,
.usuarios-card-meta span,
.dashboard-toolbar label,
.estadisticas-toolbar label,
.pizarra-anotaciones-head span,
.pizarra-biblioteca-head p {
  color: var(--theme-muted);
}

.jugadora-detalle-foto,
.equipo-detalle-icono {
  box-shadow:
    0 0 0 8px rgba(86, 220, 161, 0.08),
    0 20px 42px rgba(0, 0, 0, 0.26);
}

.jugadora-detalle-foto.sin-foto,
.equipo-detalle-icono {
  background:
    radial-gradient(circle at 30% 30%, rgba(104, 199, 255, 0.22), transparent 34%),
    linear-gradient(180deg, rgba(10, 24, 35, 0.9), rgba(5, 12, 19, 0.95));
}

@media (max-width: 900px) {
  #sidebar {
    width: 86vw;
    max-width: 320px;
    padding-top: calc(76px + env(safe-area-inset-top));
  }

  #contenido {
    margin-left: 0 !important;
    padding: 0;
  }

  .app-welcome {
    margin-left: 18px;
  }
}

/* ===========================
   PREMIUM FINISH 2.1
   Pulido de vistas clave.
=========================== */

#panelJugadoras .panel-headline,
#panelSesiones .panel-headline,
#panelUsuarios .panel-headline,
#panelEstadisticas .panel-headline,
#panelDashboard .panel-headline {
  margin-bottom: 10px;
}

#panelJugadoras .panel-hero-premium,
#panelSesiones .sesiones-hero-premium,
#panelUsuarios .panel-hero-premium,
#panelEstadisticas .panel-hero-premium,
#panelDashboard .panel-hero-premium,
#panelLista .panel-hero-premium {
  margin-bottom: 18px;
}

#panelJugadoras .panel-resumen-premium,
#panelSesiones .sesiones-resumen-premium,
#panelUsuarios .panel-resumen-premium,
#panelEstadisticas .panel-resumen-premium,
#panelDashboard .panel-resumen-premium,
#panelLista .panel-resumen-premium {
  margin: 14px 0 18px;
}

#panelJugadoras .accionesJugadoras,
#panelUsuarios .usuarios-toolbar,
#panelSesiones .sesion-form-layout,
#panelDashboard .dashboard-toolbar,
#panelEstadisticas .estadisticas-toolbar,
#panelLista .asistencia-cabecera {
  background: rgba(5, 12, 19, 0.54);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 20px;
  padding: 14px;
}

#panelJugadoras .accionesJugadoras input,
#panelJugadoras .accionesJugadoras select,
#panelUsuarios .usuarios-toolbar input,
#panelSesiones .sesion-form-card input,
#panelSesiones .sesion-form-card select,
#panelEstadisticas .estadisticas-toolbar button,
#panelDashboard .dashboard-toolbar button,
#panelLista .asistencia-sesion-trigger {
  min-height: 44px;
}

#panelJugadoras .listaJugadoras,
#panelUsuarios .usuarios-grid,
#panelDashboard .dashboard-grid,
#panelEstadisticas .stats-grid,
#panelPizarra .pizarra-guardados-lista {
  gap: 16px;
}

#panelJugadoras .jugadora-card,
#panelUsuarios .usuario-card,
#panelDashboard .dashboard-card,
#panelEstadisticas .stat-card,
#panelPizarra .pizarra-guardado-item {
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.24);
}

#panelJugadoras .jugadora-card:hover,
#panelUsuarios .usuario-card:hover,
#panelDashboard .dashboard-card:hover,
#panelEstadisticas .stat-card:hover,
#panelPizarra .pizarra-guardado-item:hover {
  border-color: rgba(104, 199, 255, 0.22);
  transform: translateY(-4px);
}

#panelJugadoras .jugadora-card {
  min-height: 170px;
}

#panelJugadoras .jugadora-foto,
#panelUsuarios .usuario-card-avatar,
#panelPizarra .pizarra-guardado-miniatura,
#panelEquipos .equipo-card-icono,
.jugadora-detalle-foto,
.equipo-detalle-icono {
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.05) inset,
    0 18px 34px rgba(0, 0, 0, 0.24);
}

#panelJugadoras .jugadora-nombre,
#panelUsuarios .usuario-card-nombre,
#panelDashboard .dashboard-card p,
#panelEstadisticas .stat-value {
  text-shadow: 0 0 24px rgba(104, 199, 255, 0.08);
}

#panelJugadoras .jugadora-detalles span,
#panelUsuarios .usuario-chip,
#panelDashboard .dashboard-card h3,
#panelEstadisticas .stat-title,
#panelLista .asistencia-contador span,
#panelPizarra .pizarra-biblioteca-chip,
#panelPizarra .pizarra-anotacion-tipo {
  backdrop-filter: blur(10px);
}

#panelJugadoras .jugadora-detalles span,
#panelUsuarios .usuario-chip,
#panelPizarra .pizarra-biblioteca-chip,
#panelPizarra .pizarra-anotacion-tipo,
#panelLista .asistencia-contador span {
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.04);
}

#panelSesiones .sesion-form-card,
#panelSesiones .sesion-seccion,
#panelSesiones .sesiones-hero-premium-card,
#panelSesiones .sesiones-resumen-premium-card,
#panelSesiones .sesiones-detalle-cabecera,
#panelSesiones .sesiones-detalle-resumen,
#panelSesiones .sesiones-detalle-plan {
  border: 1px solid rgba(255, 255, 255, 0.08);
}

#panelSesiones .sesion-tab,
#panelSesiones .sesion-tab-pane,
#panelSesiones .sesion-bloque-recursos,
#panelSesiones .sesion-recurso-item {
  border-radius: 18px;
}

#panelSesiones .sesion-tab-pane {
  padding: 16px;
  background: rgba(5, 12, 19, 0.5);
}

#panelSesiones .sesion-bloque-recursos {
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: rgba(5, 12, 19, 0.56);
}

#panelSesiones .sesion-bloque-media-header,
#panelSesiones .sesion-bloque-recursos .sesion-media-toolbar,
#panelPizarra .pizarra-biblioteca-head,
#panelPizarra .pizarra-biblioteca-row {
  border-color: rgba(255, 255, 255, 0.05);
}

#panelDashboard .dashboard-siguiente-accion,
#panelDashboard .dashboard-chart-card,
#panelDashboard .dashboard-card,
#panelEstadisticas .estadisticas-grafico-card,
#panelEstadisticas .stat-card {
  border: 1px solid rgba(255, 255, 255, 0.08);
}

#panelDashboard .dashboard-chart-card,
#panelEstadisticas .estadisticas-grafico-card {
  background: linear-gradient(180deg, rgba(12, 24, 37, 0.76), rgba(7, 14, 22, 0.92));
  border-radius: 22px;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.24);
}

#panelDashboard .dashboard-chart-card p,
#panelEstadisticas .estadisticas-card-cabecera p,
#panelPizarra .pizarra-biblioteca-head p,
#panelPizarra .pizarra-anotaciones-head span {
  color: rgba(166, 186, 199, 0.82);
}

#panelLista .item-asistencia,
#panelLista .asistencia-sesion-trigger,
#panelLista .asistencia-sesion-opciones,
#panelLista .asistencia-resumen,
#panelLista .lista-estado-entrenamiento,
#panelLista .asistencia-contador {
  border: 1px solid rgba(255, 255, 255, 0.08);
}

#panelLista .item-asistencia {
  background: linear-gradient(180deg, rgba(12, 24, 37, 0.82), rgba(7, 14, 22, 0.92));
}

#panelLista .item-asistencia[data-estado="presente"] {
  box-shadow: inset 0 0 0 1px rgba(86, 220, 161, 0.12);
}

#panelLista .item-asistencia[data-estado="ausente"] {
  box-shadow: inset 0 0 0 1px rgba(255, 114, 132, 0.12);
}

#panelLista .item-asistencia[data-estado="justificada"] {
  box-shadow: inset 0 0 0 1px rgba(198, 243, 109, 0.12);
}

#panelUsuarios .usuarios-card,
#panelUsuarios .usuario-card,
#panelUsuarios .usuarios-form-card,
#panelUsuarios .usuarios-panel-nota {
  border: 1px solid rgba(255, 255, 255, 0.08);
}

#panelUsuarios .usuario-card {
  background: linear-gradient(180deg, rgba(12, 24, 37, 0.82), rgba(7, 14, 22, 0.92));
}

#panelUsuarios .usuarios-panel-nota {
  background: rgba(5, 12, 19, 0.58);
  border-radius: 20px;
}

#panelPizarra .pizarra-marco,
#panelPizarra .pizarra-biblioteca,
#panelPizarra .pizarra-anotaciones {
  border: 1px solid rgba(255, 255, 255, 0.08);
}

#panelPizarra .pizarra-marco {
  background: linear-gradient(180deg, rgba(5, 12, 19, 0.86), rgba(7, 14, 22, 0.98));
}

#panelPizarra .pizarra-jugador {
  border: 1px solid rgba(255, 255, 255, 0.08);
}

@media (max-width: 900px) {
  #panelJugadoras .accionesJugadoras,
  #panelUsuarios .usuarios-toolbar,
  #panelSesiones .sesion-form-layout,
  #panelDashboard .dashboard-toolbar,
  #panelEstadisticas .estadisticas-toolbar,
  #panelLista .asistencia-cabecera {
    padding: 12px;
  }

  #panelJugadoras .jugadora-card,
  #panelUsuarios .usuario-card,
  #panelDashboard .dashboard-card,
  #panelEstadisticas .stat-card {
    min-height: auto;
  }
}

/* FIX LAYOUT: evitar que la columna derecha quede fuera de vista. */
#panelNuevaJugadora .form-grid {
  grid-template-columns: minmax(220px, 250px) minmax(0, 1fr) minmax(240px, 0.9fr);
}

#panelNuevaJugadora .form-foto,
#panelNuevaJugadora .form-campos,
#panelNuevaJugadora .jugadora-edicion-resumen,
#panelSesiones .sesion-campos,
#panelSesiones .sesion-seccion,
#panelSesiones .sesion-tab-pane,
#panelDashboard .dashboard-grid > *,
#panelDashboard .dashboard-chart-card,
#panelEstadisticas .estadisticas-grafico-card,
#panelEstadisticas .stat-card,
#panelUsuarios .usuarios-campos,
#panelUsuarios .usuarios-panel-nota,
#panelEquipos .equipo-detalle-grid > section,
#panelEquipos .equipo-detalle-hero > div,
#panelJugadoras .jugadora-card,
#panelJugadoras .jugadora-info,
#panelJugadoras .jugadora-acciones {
  min-width: 0;
}

#panelSesiones .sesion-form-layout {
  grid-template-columns: minmax(280px, 0.96fr) minmax(0, 1.04fr);
}

#panelDashboard .dashboard-grid,
#panelEstadisticas .stats-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

#panelDashboard .dashboard-charts-principales,
#panelEstadisticas .estadisticas-graficos {
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
}

@media (max-width: 1200px) {
  #panelNuevaJugadora .form-grid {
    grid-template-columns: minmax(220px, 250px) minmax(0, 1fr);
  }

  #panelNuevaJugadora .jugadora-edicion-resumen {
    grid-column: 1 / -1;
  }

  #panelDashboard .dashboard-grid,
  #panelEstadisticas .stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #panelDashboard .dashboard-charts-principales,
  #panelEstadisticas .estadisticas-graficos,
  #panelSesiones .sesion-form-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  #panelNuevaJugadora .form-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  #panelNuevaJugadora .form-foto,
  #panelNuevaJugadora .form-campos,
  #panelNuevaJugadora .jugadora-edicion-resumen {
    grid-column: 1;
    width: 100%;
    box-sizing: border-box;
  }

  #panelNuevaJugadora input,
  #panelNuevaJugadora select {
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
  }
}

/* FIX INTERACCIÓN SIDEBAR: garantizar clics sobre el menú lateral en escritorio. */
#sidebar {
  pointer-events: auto;
  z-index: 2000;
}

#sidebar .menu-item,
#sidebar #btnSalirApp,
#sidebar #btnAbrirLogin,
#sidebar .sidebar-usuario-boton,
#sidebar .sidebar-instalar-app {
  pointer-events: auto;
  position: relative;
  z-index: 1;
}

#contenido,
.panel,
.app-welcome {
  pointer-events: auto;
}

#startupSplash,
#startupSplash * {
  pointer-events: none;
}

/* Ajuste fino panel Equipos: más compacto y con menos altura visual */
#panelEquipos .equipos-content > .card:first-child,
#panelEquipos .equipos-panel > .card:first-child,
#panelEquipos .panel-card:first-child,
#panelEquipos .section-card:first-child {
  padding-top: 18px;
  padding-bottom: 18px;
}

#panelEquipos .equipo-card {
  padding-top: 16px;
  padding-bottom: 16px;
}

#panelEquipos .equipo-card-nombre {
  margin-bottom: 4px;
}

#panelEquipos .equipo-card-stats {
  gap: 4px;
}

#panelEquipos .equipo-card-acciones {
  gap: 8px;
}

/* Ajuste fino panel Jugadoras: cards más compactas y perfil más limpio */
#panelJugadoras .jugadora-card {
  min-height: 148px;
  padding-top: 16px;
  padding-bottom: 16px;
}

#panelJugadoras .jugadora-card .jugadora-info {
  gap: 10px;
}

#panelJugadoras .jugadora-nombre {
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.03;
}

#panelJugadoras .jugadora-detalles {
  gap: 8px;
  row-gap: 8px;
}

#panelJugadoras .jugadora-detalles span {
  min-height: 32px;
  padding-top: 6px;
  padding-bottom: 6px;
}

#panelJugadoras.jugadora-detalle-activa .jugadora-detalle-cabecera,
#panelJugadoras.jugadora-detalle-activa .jugadora-detalle-hero,
#panelJugadoras.jugadora-detalle-activa .jugadora-detalle-datos {
  margin-top: 14px;
}

#panelJugadoras .jugadora-detalle-cabecera {
  padding-top: 18px;
  padding-bottom: 18px;
}

#panelJugadoras .jugadora-detalle-hero {
  padding-top: 18px;
  padding-bottom: 18px;
}

#panelJugadoras .jugadora-detalle-datos {
  min-height: 0;
  padding-top: 16px;
  padding-bottom: 16px;
}

#panelJugadoras .jugadora-detalle-datos > div {
  min-height: 0;
}

.cumpleanos-hoy {
  display: grid;
  gap: 16px;
  margin-top: 18px;
  border-color: rgba(255, 190, 70, 0.28);
  background: linear-gradient(135deg, rgba(255, 174, 43, 0.1), rgba(7, 24, 32, 0.96));
}

.cumpleanos-hoy[hidden] {
  display: none;
}

.cumpleanos-hoy-cabecera {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
}

.cumpleanos-hoy-cabecera h3,
.cumpleanos-hoy-cabecera p {
  margin: 0;
}

.cumpleanos-hoy-cabecera p,
.cumpleanos-hoy-tarjeta span {
  color: var(--color-text-muted);
}

.cumpleanos-hoy-lista {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}

.cumpleanos-hoy-tarjeta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 18px;
  border: 1px solid rgba(255, 190, 70, 0.2);
  border-radius: 16px;
  background: rgba(3, 17, 24, 0.72);
}

.cumpleanos-hoy-tarjeta div {
  display: grid;
  gap: 5px;
}

.cumpleanos-hoy-tarjeta b {
  color: #ffd36f;
  white-space: nowrap;
}

@media (max-width: 760px) {
  .cumpleanos-hoy-cabecera {
    align-items: start;
    flex-direction: column;
  }
}

/* Panel de equipos: resumen compacto y edición en una vista independiente. */
#panelEquipos .panel-resumen-premium {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 8px 0 18px;
}

#panelEquipos .panel-resumen-premium-card {
  min-height: 0;
  padding: 12px 15px;
  gap: 4px;
  border-radius: 16px;
}

#panelEquipos .panel-resumen-premium-etiqueta {
  padding: 3px 7px;
  font-size: 10px;
}

#panelEquipos .panel-resumen-premium-card strong {
  font-size: 24px;
  line-height: 1.1;
}

#panelEquipos .panel-resumen-premium-card span {
  font-size: 13px;
}

#panelEquipos .equipos-listado-cabecera {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 2px 0 16px;
  padding: 18px 20px;
  border: 1px solid rgba(104, 211, 255, 0.13);
  border-radius: 18px;
  background: rgba(5, 20, 29, 0.64);
}

#panelEquipos .equipos-listado-cabecera h3,
#panelEquipos .equipos-listado-cabecera p {
  margin: 0;
}

#panelEquipos .equipos-listado-cabecera h3 {
  font-size: 21px;
}

#panelEquipos .equipos-listado-cabecera p {
  margin-top: 5px;
  color: var(--color-text-muted);
  font-size: 14px;
}

#panelEquipos.equipo-editor-activa > :not(#equipoEditorVista) {
  display: none !important;
}

.equipo-editor-vista {
  display: grid;
  gap: 18px;
  animation: equipoDetalleEntrada 200ms ease both;
}

.equipo-editor-cabecera,
.equipo-editor-form {
  border: 1px solid rgba(104, 211, 255, 0.15);
  border-radius: 22px;
  background: linear-gradient(145deg, rgba(11, 31, 43, 0.96), rgba(4, 17, 25, 0.9));
}

.equipo-editor-cabecera {
  display: grid;
  gap: 10px;
  padding: 28px;
}

.equipo-editor-cabecera > span {
  color: var(--color-accent, #5ed7ff);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.equipo-editor-cabecera h2,
.equipo-editor-cabecera p {
  margin: 0;
}

.equipo-editor-cabecera h2 {
  font-size: clamp(30px, 4vw, 42px);
}

.equipo-editor-cabecera p {
  max-width: 620px;
  color: var(--color-text-muted);
}

.equipo-editor-form {
  width: min(100%, 760px);
  display: grid;
  gap: 10px;
  padding: 28px;
}

.equipo-editor-form label {
  margin-top: 6px;
  font-weight: 700;
}

.equipo-editor-form input,
.equipo-editor-form select {
  min-height: 52px;
  border-radius: 13px;
}

.equipo-editor-estado {
  min-height: 20px;
  margin: 2px 0 0;
  color: #ff9baa;
}

.equipo-editor-acciones {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 12px;
}

@media (max-width: 760px) {
  #panelEquipos .panel-resumen-premium {
    grid-template-columns: 1fr;
  }

  #panelEquipos .equipos-listado-cabecera,
  .equipo-editor-acciones {
    align-items: stretch;
    flex-direction: column;
  }

  #panelEquipos .equipos-listado-cabecera .btn-pro,
  .equipo-editor-acciones button {
    width: 100%;
  }

  .equipo-editor-cabecera,
  .equipo-editor-form {
    padding: 20px;
  }
}

/* Panel de jugadores: métricas compactas y plantillas por equipo. */
#panelJugadoras .panel-resumen-premium {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
  margin: 8px 0 16px;
}

#panelJugadoras .panel-resumen-premium-card {
  min-height: 0;
  padding: 11px 14px;
  gap: 3px;
  border-radius: 15px;
}

#panelJugadoras .panel-resumen-premium-etiqueta {
  padding: 3px 7px;
  font-size: 10px;
}

#panelJugadoras .panel-resumen-premium-card strong {
  font-size: 23px;
  line-height: 1.1;
}

#panelJugadoras .panel-resumen-premium-card span {
  font-size: 13px;
}

#panelJugadoras.jugadoras-equipo-activa > :not(#jugadorasEquipoVista) {
  display: none !important;
}

.jugadoras-equipo-vista {
  display: grid;
  gap: 18px;
  opacity: 1;
}

.jugadoras-equipo-cabecera,
.jugadoras-equipo-resumen {
  border: 1px solid rgba(104, 211, 255, 0.15);
  border-radius: 22px;
  background: linear-gradient(145deg, rgba(11, 31, 43, 0.96), rgba(4, 17, 25, 0.9));
}

.jugadoras-equipo-cabecera {
  display: grid;
  gap: 10px;
  padding: 28px;
}

.jugadoras-equipo-cabecera > span {
  color: var(--color-accent, #5ed7ff);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.jugadoras-equipo-cabecera h2,
.jugadoras-equipo-cabecera p {
  margin: 0;
}

.jugadoras-equipo-cabecera h2 {
  font-size: clamp(30px, 4vw, 42px);
}

.jugadoras-equipo-cabecera p {
  color: var(--color-text-muted);
}

.jugadoras-equipo-resumen {
  display: grid;
  grid-template-columns: repeat(3, minmax(130px, 0.65fr)) minmax(280px, 1.7fr);
  gap: 10px;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
}

.jugadoras-equipo-metrica,
.jugadoras-equipo-composicion {
  display: grid;
  align-content: center;
  gap: 5px;
  min-height: 104px;
  padding: 15px 17px;
  border: 1px solid rgba(104, 211, 255, 0.15);
  border-radius: 17px;
  background: linear-gradient(145deg, rgba(11, 31, 43, 0.96), rgba(4, 17, 25, 0.9));
}

.jugadoras-equipo-metrica > span,
.jugadoras-equipo-composicion > span {
  color: var(--color-accent, #5ed7ff);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.jugadoras-equipo-metrica strong {
  color: var(--color-accent, #5ed7ff);
  font-size: 25px;
  line-height: 1.05;
}

.jugadoras-equipo-metrica small,
.jugadoras-equipo-composicion small {
  color: var(--color-text-muted);
}

.jugadoras-equipo-composicion > div {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.jugadoras-equipo-composicion > div > span,
.jugadoras-equipo-rol {
  padding: 5px 8px;
  border: 1px solid rgba(104, 211, 255, 0.14);
  border-radius: 999px;
  color: var(--color-text-muted);
  font-size: 12px;
}

.jugadoras-equipo-rol {
  cursor: pointer;
  background: rgba(3, 14, 21, 0.36);
  transition: border-color 160ms ease, background 160ms ease, color 160ms ease, transform 160ms ease;
}

.jugadoras-equipo-rol:hover,
.jugadoras-equipo-rol.activa {
  border-color: rgba(94, 215, 255, 0.5);
  background: rgba(45, 176, 217, 0.18);
  color: #dff7ff;
}

.jugadoras-equipo-rol:hover {
  transform: translateY(-1px);
}

.jugadoras-equipo-vacio {
  margin: 0;
  padding: 18px;
  border: 1px dashed rgba(104, 211, 255, 0.2);
  border-radius: 14px;
  color: var(--color-text-muted);
}

.equipo-detalle-jugador {
  display: flex;
  align-items: center;
  gap: 13px;
}

.equipo-detalle-jugador-foto {
  flex: 0 0 54px;
  width: 54px;
  height: 54px;
  border: 2px solid rgba(83, 200, 255, 0.45);
  border-radius: 50%;
  background-color: #0b1c29;
  background-position: center;
  background-size: cover;
}

.equipo-detalle-jugador-foto.sin-foto {
  display: grid;
  place-items: center;
  color: #77dcff;
  font-size: 15px;
  font-weight: 800;
}

.equipo-detalle-jugador-datos {
  display: grid;
  min-width: 0;
  gap: 8px;
}

.equipo-detalle-jugador-datos strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.equipo-detalle-jugador-atributos {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.equipo-detalle-jugador-atributos span {
  padding: 3px 7px;
  border: 1px solid rgba(83, 200, 255, 0.12);
  border-radius: 999px;
  color: var(--color-text-muted);
  font-size: 12px;
}

.equipo-detalle-sesion {
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}

.equipo-detalle-sesion:hover,
.equipo-detalle-sesion:focus-visible {
  border-color: rgba(94, 215, 255, 0.42);
  background: rgba(17, 50, 66, 0.6);
  outline: none;
  transform: translateY(-2px);
}

@media (max-width: 760px) {
  #panelJugadoras .panel-resumen-premium {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .jugadoras-equipo-cabecera {
    padding: 20px;
  }

  .jugadoras-equipo-resumen {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .jugadoras-equipo-composicion {
    grid-column: 1 / -1;
  }

  .equipo-detalle-jugador-foto {
    flex-basis: 46px;
    width: 46px;
    height: 46px;
  }
}

.asistencia-exportacion { margin-top: 22px; padding: 22px; border: 1px solid #164252; border-radius: 18px; background: #07151e; }
.asistencia-exportacion > div:first-child > span { color: #38dfaf; text-transform: uppercase; font-size: 12px; font-weight: 800; letter-spacing: .08em; }
.asistencia-exportacion h3 { margin: 6px 0; }
.asistencia-exportacion p { margin: 0; color: #9eb3c1; }
.asistencia-exportacion-filtros { display: grid; grid-template-columns: minmax(0, 2fr) repeat(2, minmax(0, 1fr)) minmax(140px, .85fr); align-items: end; gap: 12px; margin-top: 18px; }
.asistencia-pdf-campo { display: grid; gap: 7px; min-width: 0; margin: 0; font-size: 14px; font-weight: 600; color: #cfe3ed; }
.asistencia-exportacion-filtros select, .asistencia-exportacion-filtros input[type="date"] { box-sizing: border-box; width: 100%; max-width: 100%; min-width: 0; height: 48px; min-height: 48px; margin: 0; padding: 10px 12px; border-radius: 10px; border: 1px solid #1b4152; background: #061119; color: #e9f4f8; font: inherit; }
.asistencia-exportacion-filtros > button { box-sizing: border-box; width: 100%; height: 48px; min-height: 48px; margin: 0; padding: 10px 12px; }
@media (max-width: 900px) { .asistencia-exportacion-filtros { grid-template-columns: 1fr 1fr; } }
@media (max-width: 900px) { .asistencia-pdf-sesion, .asistencia-exportacion-filtros > button { grid-column: 1 / -1; } }
@media (max-width: 520px) { .asistencia-exportacion-filtros { grid-template-columns: minmax(0, 1fr); } }

.pdf-equipos-selector { grid-column: 1 / -1; padding: 12px; border: 1px solid #1b4152; border-radius: 10px; background: #061119; }
.pdf-equipos-selector strong { display: block; margin-bottom: 9px; color: #cfe3ed; font-size: .88rem; }
.pdf-equipos-opciones { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); gap: 8px; max-width: 720px; }
.pdf-equipo-opcion { display: flex; box-sizing: border-box; min-width: 0; min-height: 48px; align-items: center; gap: 10px; margin: 0; padding: 10px 12px; border: 1px solid #245066; border-radius: 12px; color: #dcecf2; cursor: pointer; }
.pdf-equipo-opcion span { min-width: 0; overflow-wrap: anywhere; line-height: 1.4; }
.pdf-equipo-opcion:has(input:checked) { border-color: #39dcb0; background: rgba(57, 220, 176, .12); color: #8cf3d4; }
.pdf-equipo-opcion input[type="checkbox"] { display: inline-block; box-sizing: border-box; flex: 0 0 20px; width: 20px; height: 20px; min-width: 20px; min-height: 20px; max-width: 20px; max-height: 20px; margin: 0; padding: 0; border: 0; border-radius: 3px; transform: none; accent-color: #39dcb0; }
.pdf-equipo-opcion input[type="checkbox"]:focus-visible { outline: 2px solid #ffd166; outline-offset: 3px; }

/* Selector de sesiones escalable: filtros compactos y resultados legibles. */
#panelLista .asistencia-sesion-opciones {
  display: block;
  max-height: min(56vh, 520px);
  overflow: auto;
  padding: 12px;
}
#panelLista .asistencia-sesion-filtros {
  display: grid;
  grid-template-columns: minmax(160px, .9fr) minmax(160px, .9fr) minmax(210px, 1.35fr) minmax(150px, .75fr);
  gap: 8px;
  position: sticky;
  top: 0;
  z-index: 1;
  padding-bottom: 10px;
  background: rgba(6, 16, 25, .98);
}
#panelLista .asistencia-selectores-lista {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
#panelLista .asistencia-sesion-filtros select,
#panelLista .asistencia-sesion-filtros input {
  min-height: 42px;
  margin: 0;
  border: 1px solid rgba(83, 200, 255, .18);
  border-radius: 10px;
  background: rgba(3, 14, 21, .9);
  color: var(--color-text);
}
#panelLista .asistencia-sesion-resultados {
  display: grid;
  gap: 7px;
}
#panelLista .asistencia-sesion-opcion {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 52px;
  padding: 10px 13px;
}
#panelLista .asistencia-sesion-opcion strong { color: var(--color-text); }
#panelLista .asistencia-sesion-opcion span { color: var(--color-text-muted); font-size: 12px; text-align: right; }
#panelLista .asistencia-sesion-vacia { margin: 10px 4px; color: var(--color-text-muted); }
@media (max-width: 720px) {
  #panelLista .asistencia-selectores-lista { grid-template-columns: 1fr; }
  #panelLista .asistencia-sesion-filtros { grid-template-columns: 1fr; }
  #panelLista .asistencia-sesion-opcion { grid-template-columns: 1fr; gap: 3px; }
  #panelLista .asistencia-sesion-opcion span { text-align: left; }
}

/* Evita que el filtro de sesiones se desborde en pantallas con barra lateral. */
#panelSesiones .sesiones-toolbar {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  width: 100%;
  max-width: 100%;
}
#panelSesiones .sesiones-toolbar > * { min-width: 0; }
#panelSesiones .sesiones-toolbar input[type="search"] { grid-column: span 2; }
#panelSesiones .sesiones-toolbar .btn-pro {
  width: 100%;
  min-width: 0;
  padding-inline: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 1120px) {
  #panelSesiones .sesiones-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #panelSesiones .sesiones-toolbar input[type="search"] { grid-column: span 2; }
}
@media (max-width: 620px) {
  #panelSesiones .sesiones-toolbar { grid-template-columns: 1fr; }
  #panelSesiones .sesiones-toolbar input[type="search"] { grid-column: auto; }
}

/* Sesiones separadas por estado temporal. */
#listaSesiones { gap: 20px; }
#panelSesiones .sesiones-grupo {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(83, 200, 255, .12);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(5, 19, 28, .62), rgba(3, 13, 20, .38));
}
#panelSesiones .sesiones-grupo-cabecera {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 4px 12px;
  border-bottom: 1px solid rgba(255, 255, 255, .07);
}
#panelSesiones .sesiones-grupo-cabecera h4 { margin: 0; color: var(--color-text); font-size: 17px; }
#panelSesiones .sesiones-grupo-cabecera p { margin: 3px 0 0; color: var(--color-text-muted); font-size: 13px; }
#panelSesiones .sesiones-grupo-cabecera > span {
  flex: 0 0 auto;
  padding: 7px 10px;
  border: 1px solid rgba(83, 200, 255, .2);
  border-radius: 999px;
  color: #80d9ff;
  font-size: 12px;
  font-weight: 800;
}
#panelSesiones .sesiones-grupo-finalizadas .sesiones-grupo-cabecera > span { color: #aabac4; border-color: rgba(170, 186, 196, .18); }
#panelSesiones .sesiones-grupo-lista { display: grid; gap: 12px; }
#panelSesiones .sesiones-grupo-vacio { padding: 24px; color: var(--color-text-muted); text-align: center; }
@media (max-width: 620px) {
  #panelSesiones .sesiones-grupo-cabecera { align-items: flex-start; flex-direction: column; }
}

/* Acceso y pantalla de historial de sesiones finalizadas. */
#panelSesiones .sesiones-historial-acceso {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px;
  margin-top: 20px;
  padding: 18px 20px;
  border: 1px solid rgba(83, 200, 255, .16);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(14, 37, 49, .72), rgba(5, 17, 26, .78));
}
#panelSesiones .sesiones-historial-acceso > div { display: grid; gap: 5px; min-width: 0; flex: 1 1 165px; }
#panelSesiones .sesiones-historial-acceso strong { color: var(--color-text); font-size: 16px; }
#panelSesiones .sesiones-historial-acceso span { color: var(--color-text-muted); font-size: 13px; }
#panelSesiones .sesiones-historial-acceso .btn-pro {
  flex: 0 1 170px;
  max-width: 100%;
  min-width: 0;
  padding-inline: 14px;
  white-space: normal;
}
#panelSesionesFinalizadas .sesiones-historial-headline { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
#panelSesionesFinalizadas .sesiones-historial-headline > div > span { color: var(--color-primary); font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
#panelSesionesFinalizadas .sesiones-historial-lista { display: grid; gap: 12px; }
@media (max-width: 700px) {
  #panelSesiones .sesiones-historial-acceso, #panelSesionesFinalizadas .sesiones-historial-headline { align-items: flex-start; flex-direction: column; }
}

#panelSesiones .sesiones-accesos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 22px; }
#panelSesiones .sesiones-accesos[hidden],
#panelSesiones .sesiones-automatizador[hidden] { display: none !important; }
#panelSesiones .sesiones-accesos .sesiones-historial-acceso { margin-top: 0; }
@media (max-width: 850px) { #panelSesiones .sesiones-accesos { grid-template-columns: 1fr; } }

#panelSesiones .sesiones-accesos { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
#panelSesiones .sesiones-crear-acceso { border-color: rgba(55, 230, 161, .22); }
@media (max-width: 1120px) { #panelSesiones .sesiones-accesos { grid-template-columns: 1fr; } }

/* Tarjetas de equipo: lectura ejecutiva y acciones rápidas. */
#panelEquipos .panel-resumen-premium { grid-template-columns: repeat(4, minmax(0, 1fr)); }
#panelEquipos .equipo-card-pro {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  min-height: 128px;
}
#panelEquipos .equipo-card-contenido { display: grid; gap: 7px; min-width: 0; }
#panelEquipos .equipo-card-estado { width: fit-content; max-width: 100%; color: #8fd9f5; font-size: 13px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#panelEquipos .equipo-card-estado.listo::before { content: "●"; margin-right: 6px; color: var(--color-primary); }
#panelEquipos .equipo-card-estado.sin-sesion { color: #a1adb4; }
#panelEquipos .equipo-card-stats, #panelEquipos .equipo-card-alertas { display: flex; flex-wrap: wrap; gap: 7px; }
#panelEquipos .equipo-card-stats span, #panelEquipos .equipo-card-alertas span { padding: 5px 8px; border: 1px solid rgba(83, 200, 255, .14); border-radius: 999px; background: rgba(6, 21, 30, .66); font-size: 12px; font-weight: 700; }
#panelEquipos .equipo-card-alertas span { color: #ffd27a; border-color: rgba(255, 191, 76, .24); }
#panelEquipos .equipo-card-acciones { position: relative; display: flex; flex-wrap: wrap; justify-content: flex-end; max-width: 360px; gap: 8px; }
#panelEquipos .equipo-accion-rapida { min-height: 38px; padding: 0 11px; border: 1px solid rgba(83, 200, 255, .2); border-radius: 10px; background: rgba(10, 33, 45, .78); color: var(--color-text); font-size: 12px; font-weight: 800; white-space: nowrap; }
#panelEquipos .equipo-accion-rapida:hover { border-color: rgba(83, 200, 255, .48); background: rgba(83, 200, 255, .16); transform: translateY(-1px); }
#panelEquipos .equipo-accion-rapida.lista { border-color: rgba(55, 230, 161, .28); color: #8ef0cf; }
#panelEquipos .equipo-opciones { position: relative; }
#panelEquipos .equipo-opciones summary { display: grid; width: 38px; min-height: 38px; place-items: center; border: 1px solid rgba(255,255,255,.12); border-radius: 10px; color: var(--color-text); cursor: pointer; font-size: 22px; line-height: 1; list-style: none; }
#panelEquipos .equipo-opciones summary::-webkit-details-marker { display: none; }
#panelEquipos .equipo-opciones-menu { position: absolute; z-index: 12; top: calc(100% + 7px); right: 0; display: grid; min-width: 170px; padding: 6px; border: 1px solid rgba(83,200,255,.18); border-radius: 12px; background: #07141e; box-shadow: 0 18px 35px rgba(0,0,0,.35); }
#panelEquipos .equipo-opciones-menu button { padding: 10px; border: 0; border-radius: 8px; background: transparent; color: var(--color-text); text-align: left; font-weight: 700; }
#panelEquipos .equipo-opciones-menu button:hover { background: rgba(83,200,255,.12); }
#panelEquipos .equipo-opciones-menu button.peligro { color: #ff9aaa; }
@media (max-width: 1180px) { #panelEquipos .panel-resumen-premium { grid-template-columns: repeat(2, minmax(0, 1fr)); } #panelEquipos .equipo-card-pro { grid-template-columns: auto minmax(0, 1fr); } #panelEquipos .equipo-card-acciones { grid-column: 1 / -1; justify-content: flex-start; max-width: none; } }
@media (max-width: 640px) { #panelEquipos .panel-resumen-premium { grid-template-columns: 1fr; } #panelEquipos .equipo-card-pro { grid-template-columns: 1fr; } }

/* Ficha de equipo: navegación operativa por pestañas. */
#panelEquipos .equipo-detalle-hero-pro {
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
}
#panelEquipos .equipo-detalle-hero-contenido { min-width: 0; }
#panelEquipos .equipo-detalle-hero-acciones { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
#panelEquipos .equipo-detalle-tabs {
  display: flex;
  gap: 8px;
  padding: 8px;
  width: max-content;
  max-width: 100%;
  overflow-x: auto;
  border: 1px solid rgba(94, 202, 255, .18);
  border-radius: 16px;
  background: rgba(4, 20, 29, .82);
}
#panelEquipos .equipo-detalle-tabs button {
  flex: 0 0 auto;
  border: 1px solid transparent;
  border-radius: 11px;
  padding: 10px 15px;
  background: transparent;
  color: #a8bbc6;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
#panelEquipos .equipo-detalle-tabs button:hover { color: #effaff; background: rgba(255, 255, 255, .05); }
#panelEquipos .equipo-detalle-tabs button.activa { color: #04212e; background: #5bd0ff; box-shadow: 0 6px 16px rgba(40, 180, 237, .2); }
#panelEquipos .equipo-detalle-tabs span {
  display: inline-grid;
  place-items: center;
  min-width: 20px;
  height: 20px;
  margin-left: 5px;
  padding: 0 5px;
  border-radius: 99px;
  background: rgba(6, 38, 52, .18);
  font-size: .78rem;
}
#panelEquipos .equipo-detalle-tab-panel {
  border: 1px solid rgba(94, 202, 255, .17);
  border-radius: 22px;
  padding: clamp(18px, 2vw, 28px);
  background: linear-gradient(145deg, rgba(5, 24, 35, .88), rgba(3, 15, 24, .92));
}
#panelEquipos .equipo-resumen-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 13px;
}
#panelEquipos .equipo-resumen-grid article,
#panelEquipos .equipo-resumen-siguiente {
  border: 1px solid rgba(100, 220, 180, .16);
  border-radius: 16px;
  padding: 16px;
  background: rgba(6, 28, 38, .78);
}
#panelEquipos .equipo-resumen-grid span,
#panelEquipos .equipo-resumen-siguiente > span {
  display: block;
  color: #6ee6c1;
  font-size: .73rem;
  font-weight: 900;
  letter-spacing: .055em;
  text-transform: uppercase;
}
#panelEquipos .equipo-resumen-grid strong { display: block; margin-top: 7px; color: #f2fbff; font-size: 1.3rem; }
#panelEquipos .equipo-resumen-grid p,
#panelEquipos .equipo-resumen-siguiente p { margin: 6px 0 0; color: #9eb2be; line-height: 1.4; }
#panelEquipos .equipo-resumen-siguiente { margin-top: 14px; }
#panelEquipos .equipo-resumen-siguiente strong { display: block; margin-top: 6px; color: #f2fbff; font-size: 1.06rem; }
#panelEquipos .equipo-detalle-tab-panel .equipo-detalle-lista { margin-top: 18px; }
@media (max-width: 980px) {
  #panelEquipos .equipo-detalle-hero-pro { grid-template-columns: auto minmax(0, 1fr); }
  #panelEquipos .equipo-detalle-hero-acciones { grid-column: 1 / -1; justify-content: flex-start; }
  #panelEquipos .equipo-resumen-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  #panelEquipos .equipo-detalle-hero-pro { grid-template-columns: 1fr; }
  #panelEquipos .equipo-detalle-icono { display: none; }
  #panelEquipos .equipo-detalle-hero-acciones { grid-column: auto; }
  #panelEquipos .equipo-detalle-hero-acciones .btn-pro { flex: 1 1 140px; }
  #panelEquipos .equipo-resumen-grid { grid-template-columns: 1fr; }
}

/* Corrección del menú contextual de equipos: sólo se despliega al pulsar. */
#panelEquipos .equipo-opciones-menu { display: none; }
#panelEquipos .equipo-opciones[open] .equipo-opciones-menu { display: grid; }
#panelEquipos .equipo-card-contenido { display: grid; gap: 7px; align-content: center; }
#panelEquipos .equipo-card-stats,
#panelEquipos .equipo-card-alertas { align-items: center; }
#panelEquipos .equipo-card-stats span,
#panelEquipos .equipo-card-alertas span { flex: 0 0 auto; }

/* El menú contextual debe poder salir de la tarjeta sin quedar recortado. */
#panelEquipos .equipo-card-pro { overflow: visible; }
#panelEquipos .equipo-card-pro:has(.equipo-opciones[open]) { position: relative; z-index: 30; }
#panelEquipos .equipo-opciones-menu { z-index: 50; }

/* Barra de búsqueda y filtros del área de equipos. */
#panelEquipos .equipos-filtros {
  margin: 0 0 20px;
  padding: 16px 18px;
  border: 1px solid rgba(83, 200, 255, .16);
  border-radius: 18px;
  background: linear-gradient(105deg, rgba(5, 28, 39, .9), rgba(4, 19, 29, .9));
}
#panelEquipos .equipos-filtros-cabecera { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 11px; color: #a8c4d0; font-size: .82rem; font-weight: 800; }
#panelEquipos .equipos-filtros-cabecera span { color: #6ee6c1; letter-spacing: .06em; text-transform: uppercase; }
#panelEquipos .equipos-filtros-cabecera strong { color: #e9f8ff; }
#panelEquipos .equipos-filtros-controles { display: grid; grid-template-columns: minmax(210px, 1.5fr) minmax(170px, .8fr) minmax(185px, .9fr) auto; gap: 10px; align-items: center; }
#panelEquipos .equipos-filtros input,
#panelEquipos .equipos-filtros select { min-width: 0; min-height: 44px; padding: 0 13px; border: 1px solid rgba(111, 186, 215, .21); border-radius: 11px; background: rgba(2, 15, 24, .86); color: #edfaff; font: inherit; }
#panelEquipos .equipos-filtros input:focus,
#panelEquipos .equipos-filtros select:focus { outline: none; border-color: #58caff; box-shadow: 0 0 0 3px rgba(88, 202, 255, .13); }
#panelEquipos .equipos-filtros .btn-pro { min-height: 44px; white-space: nowrap; }
@media (max-width: 960px) { #panelEquipos .equipos-filtros-controles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 570px) { #panelEquipos .equipos-filtros-controles { grid-template-columns: 1fr; } #panelEquipos .equipos-filtros .btn-pro { width: 100%; } }

/* Indicador de revisión en el resumen ejecutivo de equipos. */
#panelEquipos .panel-resumen-premium-card.panel-resumen-alerta { border-color: rgba(255, 190, 78, .32); background: linear-gradient(145deg, rgba(58, 43, 8, .45), rgba(6, 22, 30, .82)); }
#panelEquipos .panel-resumen-premium-card.panel-resumen-alerta strong { color: #ffd36e; }

/* Acceso directo a la ficha individual desde la plantilla de un equipo. */
#panelEquipos .equipo-detalle-jugador { grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; }
#panelEquipos .equipo-detalle-editar-jugadora { min-height: 34px; padding: 0 10px; border: 1px solid rgba(83, 200, 255, .24); border-radius: 9px; background: rgba(10, 35, 48, .76); color: #aee8ff; font: inherit; font-size: .78rem; font-weight: 800; cursor: pointer; white-space: nowrap; }
#panelEquipos .equipo-detalle-editar-jugadora:hover { border-color: #62cdf5; background: rgba(83, 200, 255, .15); color: #f1fbff; }
@media (max-width: 620px) { #panelEquipos .equipo-detalle-jugador { grid-template-columns: auto minmax(0, 1fr); } #panelEquipos .equipo-detalle-editar-jugadora { grid-column: 2; justify-self: start; margin-top: 7px; } }

/* Identidad, archivado y campos avanzados de equipo. */
#panelEquipos .equipo-card-pro { border-left: 4px solid var(--equipo-color, #22c55e); }
#panelEquipos .equipo-card-icono { color: var(--equipo-color, #5bd0ff); }
#panelEquipos .equipo-card-pro.equipo-archivado { opacity: .72; filter: saturate(.72); }
#panelEquipos .equipo-card-pro.equipo-archivado::after { content: "ARCHIVADO"; position: absolute; top: 12px; right: 14px; color: #ffc76f; font-size: .68rem; font-weight: 900; letter-spacing: .08em; }
#panelEquipos .equipo-detalle-hero { border-left: 5px solid var(--equipo-color, #22c55e); }
#panelEquipos .equipo-detalle-icono { color: var(--equipo-color, #5bd0ff); }
#panelEquipos .equipos-filtros-controles { grid-template-columns: minmax(230px, 1.35fr) minmax(245px, 1fr) minmax(185px, .8fr) minmax(205px, .95fr) auto; }
#panelEquipos #editorColorEquipo { min-height: 44px; width: 100%; padding: 4px; cursor: pointer; }
@media (max-width: 1120px) { #panelEquipos .equipos-filtros-controles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Operativa premium de la plantilla: orden, grupos y acciones múltiples. */
#panelJugadoras .panel-headline .btn-pro {
  flex: 0 0 auto;
  min-width: 190px;
}
#panelJugadoras .acciones-jugadoras-pro { display: grid; grid-template-columns: minmax(260px, 1.25fr) minmax(245px, 1fr) minmax(215px, .85fr) auto; gap: 12px; align-items: center; }
#panelJugadoras .acciones-masivas-jugadoras[hidden] { display: none !important; }
#panelJugadoras .acciones-masivas-jugadoras { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 12px 0 4px; padding: 12px 14px; border: 1px solid rgba(73, 216, 169, .28); border-radius: 15px; background: linear-gradient(100deg, rgba(7, 48, 43, .82), rgba(4, 20, 29, .92)); }
#panelJugadoras .acciones-masivas-jugadoras strong { color: #7ff0c8; margin-right: auto; }
#panelJugadoras .acciones-masivas-jugadoras select { min-height: 40px; min-width: 180px; padding: 0 10px; border: 1px solid rgba(109, 203, 234, .25); border-radius: 10px; background: #06131c; color: #e9f8ff; font: inherit; }
#panelJugadoras .jugadora-card { position: relative; }
#panelJugadoras .jugadora-selector { position: static; flex: 0 0 20px; width: 20px; height: 20px; margin: auto 1px auto 0; accent-color: #31dfaa; cursor: pointer; }
#panelJugadoras .jugadora-card:has(.jugadora-selector:checked) { border-color: rgba(49, 223, 170, .8); box-shadow: inset 0 0 0 1px rgba(49, 223, 170, .38), 0 12px 30px rgba(0, 0, 0, .2); }
#panelJugadoras .jugadoras-grupo-posicion { grid-column: 1 / -1; margin: 8px 0 -6px; padding: 10px 14px; border-left: 3px solid #59d2ff; border-radius: 10px; background: rgba(14, 49, 64, .42); color: #dff8ff; font-size: .9rem; }
#panelJugadoras .jugadora-ficha-estado { width: max-content; max-width: 100%; margin-top: 9px; padding: 4px 8px; border: 1px solid rgba(255, 191, 74, .28); border-radius: 999px; color: #ffd36e; font-size: .68rem; font-weight: 800; }
#panelJugadoras .jugadora-ficha-estado.completa { border-color: rgba(61, 222, 164, .3); color: #77edc3; }
.jugadora-rendimiento-360 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin-top: 18px; overflow: hidden; border-radius: 16px; background: rgba(83, 200, 255, .14); }
.jugadora-rendimiento-360 > div { display: grid; gap: 7px; min-height: 116px; padding: 19px 20px; background: rgba(3, 14, 21, .8); }
.jugadora-rendimiento-360 span { color: #88b4c7; font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.jugadora-rendimiento-360 strong { color: #eafaff; font-size: 1.5rem; }
.jugadora-rendimiento-360 small { color: #9ab5c2; }
@media (max-width: 1180px) { #panelJugadoras .acciones-jugadoras-pro { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { #panelJugadoras .acciones-jugadoras-pro { grid-template-columns: 1fr; } #panelJugadoras .acciones-masivas-jugadoras > * { width: 100%; } .jugadora-rendimiento-360 { grid-template-columns: 1fr; } }
/* Las pestañas de equipo se comportan como acciones visibles e interactivas. */
#panelJugadoras .tab-equipo { cursor: pointer; transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, color 160ms ease, box-shadow 160ms ease; }
#panelJugadoras .tab-equipo:hover { transform: translateY(-2px); border-color: rgba(89, 210, 255, .58); background: linear-gradient(145deg, rgba(38, 137, 171, .26), rgba(14, 46, 62, .6)); color: #dff8ff; box-shadow: 0 8px 18px rgba(0, 0, 0, .2), inset 0 0 0 1px rgba(113, 223, 255, .08); }
#panelJugadoras .tab-equipo.activa:hover { border-color: rgba(112, 225, 255, .82); background: linear-gradient(145deg, rgba(70, 185, 221, .3), rgba(21, 83, 106, .72)); color: #a9eeff; }
#panelJugadoras .tab-equipo:focus-visible { outline: 3px solid rgba(92, 210, 255, .42); outline-offset: 3px; }
/* Los filtros responden de forma sutil, sin competir con las acciones principales. */
#panelJugadoras .acciones-jugadoras-pro input,
#panelJugadoras .acciones-jugadoras-pro select { transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease; }
#panelJugadoras .acciones-jugadoras-pro input:hover,
#panelJugadoras .acciones-jugadoras-pro select:hover { border-color: rgba(108, 194, 226, .42); background: rgba(10, 34, 46, .78); }
#panelJugadoras .acciones-jugadoras-pro input:focus,
#panelJugadoras .acciones-jugadoras-pro select:focus { border-color: #5bcfff; background: rgba(8, 35, 48, .92); box-shadow: 0 0 0 3px rgba(91, 207, 255, .14); outline: none; }
/* Equipos: todos los controles comunican que son interactivos sin romper la jerarquía visual. */
#panelEquipos button,
#panelEquipos select,
#panelEquipos input,
#panelEquipos summary { transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, color 160ms ease, box-shadow 160ms ease; }
#panelEquipos button:not(:disabled):hover,
#panelEquipos summary:hover { transform: translateY(-2px); border-color: rgba(96, 211, 245, .58); box-shadow: 0 8px 18px rgba(0, 0, 0, .2), inset 0 0 0 1px rgba(117, 225, 255, .08); filter: brightness(1.08); }
#panelEquipos select:hover,
#panelEquipos input:hover { border-color: rgba(108, 194, 226, .42); background: rgba(10, 34, 46, .78); }
#panelEquipos select:focus,
#panelEquipos input:focus { border-color: #5bcfff; background: rgba(8, 35, 48, .92); box-shadow: 0 0 0 3px rgba(91, 207, 255, .14); outline: none; }
#panelEquipos button:focus-visible,
#panelEquipos summary:focus-visible { outline: 3px solid rgba(92, 210, 255, .42); outline-offset: 3px; }
#panelEquipos .equipo-card-pro:hover { border-color: var(--equipo-color, #5bcfff); }
/* Centro operativo de sesiones: lectura rápida e interacción consistente. */
#panelSesiones .sesiones-resumen-premium { grid-template-columns: minmax(250px, 1.45fr) repeat(3, minmax(150px, .7fr)); }
#panelSesiones .sesiones-resumen-destacada { border-color: rgba(80, 219, 172, .3); background: linear-gradient(135deg, rgba(10, 56, 49, .76), rgba(5, 21, 30, .92)); }
#panelSesiones button,
#panelSesionesPendientes button,
#panelSesionesFinalizadas button,
#panelCrearSesion button,
#panelSesiones select,
#panelSesiones input,
#panelSesionesPendientes select,
#panelSesionesPendientes input,
#panelCrearSesion select,
#panelCrearSesion input { transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, color 160ms ease, box-shadow 160ms ease; }
#panelSesiones button:not(:disabled):hover,
#panelSesionesPendientes button:not(:disabled):hover,
#panelSesionesFinalizadas button:not(:disabled):hover,
#panelCrearSesion button:not(:disabled):hover { transform: translateY(-2px); border-color: rgba(96, 211, 245, .58); box-shadow: 0 8px 18px rgba(0, 0, 0, .2), inset 0 0 0 1px rgba(117, 225, 255, .08); filter: brightness(1.08); }
#panelSesiones select:hover,
#panelSesiones input:hover,
#panelSesionesPendientes select:hover,
#panelSesionesPendientes input:hover,
#panelCrearSesion select:hover,
#panelCrearSesion input:hover { border-color: rgba(108, 194, 226, .42); background: rgba(10, 34, 46, .78); }
#panelSesiones select:focus,
#panelSesiones input:focus,
#panelSesionesPendientes select:focus,
#panelSesionesPendientes input:focus,
#panelCrearSesion select:focus,
#panelCrearSesion input:focus { border-color: #5bcfff; box-shadow: 0 0 0 3px rgba(91, 207, 255, .14); outline: none; }
#panelSesionesPendientes .item-lista:hover,
#panelSesionesFinalizadas .item-lista:hover { border-color: rgba(72, 213, 162, .45); transform: translateY(-2px); }
.sesion-estado-chip.temporal { border-color: rgba(91, 207, 255, .28); color: #9fe7ff; }
.sesion-estado-chip.temporal.hoy { border-color: rgba(79, 224, 166, .45); background: rgba(59, 214, 151, .14); color: #8cf3ca; }
@media (max-width: 1100px) { #panelSesiones .sesiones-resumen-premium { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { #panelSesiones .sesiones-resumen-premium { grid-template-columns: 1fr; } }
/* Filtros de sesiones: acciones secundarias apiladas para conservar espacio horizontal. */
#panelSesionesPendientes .sesiones-toolbar { grid-template-columns: minmax(220px, 1.35fr) minmax(175px, .8fr) minmax(160px, .75fr) minmax(138px, .62fr) minmax(138px, .62fr) minmax(158px, .76fr) auto; align-items: stretch; }
#panelSesionesPendientes .sesiones-filtros-rapidos { display: grid; grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 8px; min-width: 0; }
#panelSesionesPendientes .sesiones-filtros-rapidos .btn-pro { min-height: 40px; white-space: nowrap; }
#panelSesionesPendientes #btnSesionesLimpiarFiltros { align-self: stretch; }
#panelSesionesPendientes .sesiones-filtro-resumen { grid-column: 1 / -1; }
@media (max-width: 1320px) { #panelSesionesPendientes .sesiones-toolbar { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.sesiones-automatizador {
  display: grid;
  gap: 18px;
  margin-top: 18px;
}
.sesiones-automatizador-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
}
.sesiones-automatizador-head span {
  color: #78e6d5;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.sesiones-automatizador-head h3 {
  margin: 6px 0;
}
.sesiones-automatizador-head p {
  margin: 0;
  color: #b8cad3;
}
.sesiones-automatizador-head strong {
  flex: 0 0 auto;
  padding: 9px 12px;
  border: 1px solid rgba(91, 207, 255, .22);
  border-radius: 10px;
  color: #eaf7ff;
  background: rgba(7, 24, 34, .72);
}
.sesiones-auto-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
}
.sesiones-auto-grid label,
.sesiones-auto-festivos label {
  display: grid;
  gap: 7px;
  color: #b8cad3;
  font-size: 13px;
  font-weight: 700;
}
.sesiones-auto-grid input,
.sesiones-auto-grid select,
.sesiones-auto-festivos input {
  min-height: 42px;
  border: 1px solid rgba(91, 207, 255, .22);
  border-radius: 10px;
  background: rgba(6, 17, 25, .72);
  color: #f4fbff;
  padding: 0 12px;
}
.sesiones-auto-dias {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.sesiones-auto-dias label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 11px;
  border: 1px solid rgba(91, 207, 255, .22);
  border-radius: 999px;
  color: #dcecf3;
  background: rgba(8, 27, 38, .72);
}
.sesiones-auto-acciones {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
@media (max-width: 1180px) { .sesiones-auto-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 680px) { .sesiones-automatizador-head { flex-direction: column; } .sesiones-auto-grid { grid-template-columns: 1fr; } }

.dashboard-operativo {
  display: grid;
  grid-template-columns: minmax(620px, 1.45fr) minmax(320px, .95fr) minmax(260px, .75fr);
  gap: 16px;
  margin: 18px 0;
}
.dashboard-operativo > div {
  padding: 18px;
  border: 1px solid rgba(91, 207, 255, .18);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(7, 25, 35, .86), rgba(5, 18, 27, .96));
}
.dashboard-operativo span {
  color: #78e6d5;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.dashboard-operativo h3 {
  margin: 7px 0 12px;
  color: #f1fbff;
}
.dashboard-operativo p {
  color: #b8cad3;
  line-height: 1.45;
}
.dashboard-calendario-semana {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  gap: 10px;
}
.dashboard-dia {
  min-height: 132px;
  padding: 12px;
  border: 1px solid rgba(91, 207, 255, .16);
  border-radius: 12px;
  background: rgba(4, 16, 24, .64);
}
.dashboard-dia strong,
.dashboard-dia span {
  display: block;
  letter-spacing: 0;
  text-transform: none;
}
.dashboard-dia > strong { color: #f2fbff; font-size: 14px; }
.dashboard-dia span { margin: 3px 0 8px; color: #a9bbc6; font-size: 12px; font-weight: 600; }
.dashboard-dia button,
.dashboard-aviso {
  display: block;
  width: 100%;
  margin-top: 6px;
  border: 0;
  border-radius: 9px;
  background: rgba(55, 230, 161, .12);
  color: #dffcf4;
  padding: 8px 9px;
  text-align: left;
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}
.dashboard-dia button {
  display: grid;
  gap: 2px;
  min-height: 52px;
}
.dashboard-dia button strong {
  color: #effff9;
  font-size: 13px;
  line-height: 1.1;
}
.dashboard-dia button span {
  margin: 0;
  color: #c9f6ea;
  font-size: 12px;
  font-weight: 700;
  overflow-wrap: anywhere;
  line-height: 1.2;
}
.dashboard-avisos {
  display: grid;
  gap: 8px;
}
.dashboard-aviso {
  margin-top: 0;
  border: 1px solid rgba(91, 207, 255, .16);
  background: rgba(8, 27, 38, .72);
}
.dashboard-aviso.ok { border-color: rgba(55, 230, 161, .24); }
.dashboard-aviso.alerta { border-color: rgba(255, 190, 78, .34); color: #ffe0a1; }
@media (max-width: 1180px) { .dashboard-operativo { grid-template-columns: 1fr; } .dashboard-calendario-semana { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); } }

.sidebar-tema-prueba {
  width: 100%;
  margin: 10px 0 12px;
  border: 1px solid rgba(91, 207, 255, .24);
  border-radius: 12px;
  background: rgba(12, 30, 42, .9);
  color: #dff8ff;
  min-height: 42px;
  font-weight: 800;
  cursor: pointer;
}
.sidebar-tema-prueba[aria-pressed="true"] {
  border-color: rgba(255, 189, 89, .46);
  background: linear-gradient(135deg, rgba(255, 189, 89, .28), rgba(255, 99, 102, .18));
  color: #fff2d8;
}

body.tema-prueba-colores {
  --color-primary: #ffd23f;
  --color-primary-strong: #20b8ff;
  --color-danger: #ff6b7a;
  --color-warning: #ffbf1f;
  --team-andromeda: #c65cff;
  --team-aguila: #00d4ff;
  --team-senior: #ffd23f;
  background:
    radial-gradient(circle at 12% 8%, rgba(255, 210, 63, .34), transparent 26%),
    radial-gradient(circle at 84% 10%, rgba(0, 212, 255, .24), transparent 30%),
    radial-gradient(circle at 72% 88%, rgba(198, 92, 255, .22), transparent 34%),
    linear-gradient(135deg, #160f07 0%, #071424 46%, #140a1c 100%);
}
body.tema-prueba-colores #sidebar {
  background:
    radial-gradient(circle at 20% 0%, rgba(255, 210, 63, .24), transparent 34%),
    radial-gradient(circle at 92% 18%, rgba(0, 212, 255, .14), transparent 28%),
    linear-gradient(180deg, rgba(22, 15, 7, .98), rgba(3, 18, 35, .96));
  border-right-color: rgba(255, 210, 63, .36);
}
body.tema-prueba-colores .logo {
  background: linear-gradient(135deg, #ffd23f, #00d4ff, #c65cff);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
body.tema-prueba-colores .menu-item {
  border-color: rgba(0, 212, 255, .14);
  background: rgba(6, 22, 38, .58);
}
body.tema-prueba-colores .menu-item:hover {
  background: linear-gradient(135deg, rgba(255, 210, 63, .24), rgba(0, 212, 255, .16));
}
body.tema-prueba-colores .menu-item.activo,
body.tema-prueba-colores .menu-item[aria-current="page"] {
  position: relative;
  border-color: rgba(255, 210, 63, .9);
  background:
    linear-gradient(135deg, rgba(255, 210, 63, .36), rgba(0, 212, 255, .18)),
    rgba(9, 24, 34, .95);
  color: #fff4b8;
  box-shadow:
    inset 6px 0 0 #ffd23f,
    0 0 0 1px rgba(255, 210, 63, .18),
    0 12px 28px rgba(255, 210, 63, .22);
  transform: translateX(5px);
}
body.tema-prueba-colores .menu-item.activo::after,
body.tema-prueba-colores .menu-item[aria-current="page"]::after {
  content: "";
  position: absolute;
  right: 14px;
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: #ffd23f;
  box-shadow: 0 0 18px rgba(255, 210, 63, .9);
}
body.tema-prueba-colores .menu-item.activo svg,
body.tema-prueba-colores .menu-item[aria-current="page"] svg {
  fill: #ffd23f;
  filter: drop-shadow(0 0 8px rgba(255, 210, 63, .55));
}
body.tema-prueba-colores .panel,
body.tema-prueba-colores .bloque,
body.tema-prueba-colores .dashboard-card,
body.tema-prueba-colores .dashboard-chart-card,
body.tema-prueba-colores .panel-resumen-premium-card {
  border-color: rgba(255, 210, 63, .22);
  background:
    linear-gradient(145deg, rgba(26, 18, 8, .88), rgba(4, 23, 35, .86)),
    radial-gradient(circle at 100% 0%, rgba(255, 210, 63, .12), transparent 28%);
  box-shadow: 0 18px 42px rgba(0, 0, 0, .34), inset 0 1px 0 rgba(255, 255, 255, .06);
}
body.tema-prueba-colores .panel-headline h2,
body.tema-prueba-colores .dashboard-operativo h3,
body.tema-prueba-colores .sesiones-automatizador-head h3 {
  text-shadow: 0 0 28px rgba(255, 210, 63, .24);
}
body.tema-prueba-colores .btn-crear,
body.tema-prueba-colores .btn-guardar {
  background: linear-gradient(135deg, #ffd23f, #ff9f1a);
  color: #061019;
  box-shadow: 0 12px 28px rgba(255, 210, 63, .24);
}
body.tema-prueba-colores .btn-secundario {
  background: linear-gradient(135deg, rgba(0, 212, 255, .96), rgba(93, 178, 255, .82));
  color: #031923;
  box-shadow: 0 12px 26px rgba(0, 212, 255, .18);
}
body.tema-prueba-colores .btn-eliminar,
body.tema-prueba-colores .btn-cancelar {
  border-color: rgba(255, 107, 122, .48);
  color: #ffd7dc;
}
body.tema-prueba-colores .sesion-estado-chip.temporal.hoy,
body.tema-prueba-colores .dashboard-aviso.ok {
  border-color: rgba(255, 210, 63, .48);
  background: rgba(255, 210, 63, .16);
}
body.tema-prueba-colores .dashboard-aviso.alerta {
  border-color: rgba(255, 210, 63, .72);
  background: linear-gradient(135deg, rgba(255, 210, 63, .24), rgba(198, 92, 255, .12));
  color: #fff0c9;
}
body.tema-prueba-colores .item-lista:has(.sesion-meta span:nth-child(3)),
body.tema-prueba-colores .dashboard-dia button {
  box-shadow: inset 3px 0 0 rgba(67, 224, 183, .35);
}
body.tema-prueba-colores [data-equipo-slug="andromeda"] {
  --team-color: var(--team-andromeda);
  --team-bg: rgba(198, 92, 255, .24);
}
body.tema-prueba-colores [data-equipo-slug="aguila"] {
  --team-color: var(--team-aguila);
  --team-bg: rgba(0, 212, 255, .22);
}
body.tema-prueba-colores [data-equipo-slug="senior-albal"] {
  --team-color: var(--team-senior);
  --team-bg: rgba(255, 210, 63, .24);
}
body.tema-prueba-colores .item-lista[data-equipo-slug],
body.tema-prueba-colores .dashboard-dia button[data-equipo-slug],
body.tema-prueba-colores .asistencia-sesion-trigger[data-equipo-slug] {
  border-color: color-mix(in srgb, var(--team-color, #43e0b7) 62%, transparent);
  background:
    linear-gradient(135deg, var(--team-bg, rgba(67, 224, 183, .12)), rgba(8, 16, 32, .88));
  box-shadow:
    inset 5px 0 0 var(--team-color, #43e0b7),
    0 12px 30px color-mix(in srgb, var(--team-color, #43e0b7) 18%, transparent);
}
body.tema-prueba-colores .item-lista[data-equipo-slug] .sesion-nombre,
body.tema-prueba-colores .dashboard-dia button[data-equipo-slug] strong {
  color: color-mix(in srgb, var(--team-color, #43e0b7) 72%, #ffffff);
}
body.tema-prueba-colores .sesion-estado-chip {
  border-color: rgba(85, 214, 255, .24);
  background: rgba(85, 214, 255, .08);
}
body.tema-prueba-colores .sesion-estado-chip.activo {
  border-color: rgba(255, 210, 63, .55);
  color: #fff0a8;
  background: rgba(255, 210, 63, .14);
}
body.tema-prueba-colores .asistencia-estado-opcion.activa[data-estado="presente"] {
  background: rgba(67, 224, 183, .22);
  border-color: rgba(67, 224, 183, .52);
}
body.tema-prueba-colores .asistencia-estado-opcion.activa[data-estado="justificada"],
body.tema-prueba-colores .asistencia-motivo-opcion.activa {
  background: rgba(255, 202, 102, .2);
  border-color: rgba(255, 202, 102, .5);
}
body.tema-prueba-colores .item-asistencia[data-estado="ausente"] .asistencia-estado-opcion.activa,
body.tema-prueba-colores .asistencia-estado-opcion.activa[data-estado="ausente"] {
  background: rgba(255, 107, 122, .18);
  border-color: rgba(255, 107, 122, .52);
}

/* Invitadas: identificación compartida en tarjetas y asistencia. */
#panelJugadoras .jugadora-card.es-invitada,
#panelLista .item-asistencia.es-invitada {
  background: linear-gradient(135deg, #482368, #2c193f);
  border-color: #a879d1;
}
#panelJugadoras .jugadora-card.es-invitada:hover,
#panelLista .item-asistencia.es-invitada:hover {
  background: linear-gradient(135deg, #57307b, #38204f);
  border-color: #c49aeb;
}
#panelJugadoras .etiqueta-invitada,
#panelLista .asistencia-datos .etiqueta-invitada {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  margin-top: 6px;
  padding: 3px 9px;
  border: 1px solid #c49aeb;
  border-radius: 999px;
  background: #7541a0;
  color: #ffffff;
  font-size: .75rem;
  font-weight: 800;
  line-height: 1.4;
}
.evolucion-tecnica { margin-top: 24px; padding: clamp(16px, 3vw, 28px); border: 1px solid #294955; border-radius: 20px; background: #091c28; color: #edf8fc; }
.evolucion-tecnica header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; }
.evolucion-tecnica h3 { margin: 6px 0; font-size: 1.5rem; }
.evolucion-tecnica h4 { margin: 0 0 14px; }
.evolucion-tecnica p, .evolucion-tecnica small { color: #b9cdd9; line-height: 1.6; }
.tecnica-eyebrow { color: #77dfd3; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; }
.evolucion-tecnica label { display: grid; gap: 8px; font-size: .86rem; }
.evolucion-tecnica input, .evolucion-tecnica textarea { box-sizing: border-box; width: 100%; min-height: 46px; border: 1px solid #527280; border-radius: 9px; padding: 10px 12px; background: #06121b; color: #f4faff; font: inherit; font-size: 16px; color-scheme: dark; }
.evolucion-tecnica :focus-visible { outline: 2px solid #81ece0; outline-offset: 3px; }
.evolucion-tecnica fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.evolucion-tecnica legend { margin-bottom: 12px; font-weight: 700; }
.tecnica-metricas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.tecnica-metrica { display: grid; gap: 14px; min-width: 0; padding: 18px; background: #102d3c; border: 1px solid #365568; border-radius: 14px; }
.tecnica-notas { margin: 18px 0; }
.evolucion-tecnica textarea { resize: vertical; }
.evolucion-tecnica button { min-height: 46px; cursor: pointer; }
.evolucion-tecnica button[type=submit] { background: #79e3cc; color: #06231d; border: 1px solid #a0f3df; font-weight: 800; }
.evolucion-tecnica fieldset:disabled button[type=submit] { opacity: .55; cursor: wait; }
.tecnica-estado { min-height: 1.6em; }
.tecnica-historial { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 12px; }
.tecnica-historial article { min-width: 0; padding: 16px; border-radius: 12px; border: 1px solid #365568; background: #0b2330; }
.tecnica-historial button { color: #9eece1; background: transparent; border: 0; text-align: left; padding: 0; font: inherit; font-weight: 700; }
.tecnica-historial article > div { display: grid; gap: 6px; margin-top: 10px; font-size: .85rem; }
.tecnica-historial meter { width: 100%; height: 12px; accent-color: #67dbcb; }
.tecnica-historial p { white-space: pre-wrap; overflow-wrap: anywhere; }
@media (max-width: 700px) { .tecnica-metricas { grid-template-columns: 1fr; } .evolucion-tecnica header > label { width: 100%; } .evolucion-tecnica form button { width: 100%; } }

.rankings-tecnicos { margin: 22px 0; padding: clamp(16px, 2.5vw, 28px); background: #091e2a; border: 1px solid #325565; border-radius: 20px; color: #edf8fc; }
.rankings-tecnicos header { display: flex; flex-wrap: wrap; gap: 20px; align-items: center; justify-content: space-between; }
.ranking-eyebrow { color: #83ead7; font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; }
.rankings-tecnicos h3 { margin: 7px 0; font-size: 1.5rem; }
.rankings-tecnicos p { color: #b8ceda; line-height: 1.5; }
.ranking-filtros { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; }
.ranking-filtros label { display: grid; gap: 7px; font-size: .85rem; }
.ranking-filtros input, .ranking-filtros select, .ranking-filtros button { box-sizing: border-box; min-height: 46px; padding: 10px 12px; border: 1px solid #537b8e; border-radius: 9px; background: #071620; color: #edf8fc; font: inherit; font-size: 16px; color-scheme: dark; max-width: 100%; }
.ranking-filtros button { background: #79e3cc; color: #072a22; font-weight: 700; cursor: pointer; }
.ranking-filtros :focus-visible { outline: 2px solid #83ead7; outline-offset: 3px; }
.ranking-columnas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ranking-tecnica { min-width: 0; padding: 16px; background: #102c3a; border: 1px solid #355969; border-radius: 14px; }
.ranking-tecnica h4 { font-size: 1.1rem; margin: 0; }
.ranking-tecnica > p { font-size: .85rem; }
.ranking-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ranking-lista li { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 12px 8px; border: 1px solid #355363; border-radius: 10px; background: #0b202c; }
.ranking-lista .ranking-lider { background: #153b35; border-color: #66c8ab; }
.ranking-puesto { color: #a6ddce; font-weight: 800; }
.ranking-identidad { display: grid; gap: 4px; overflow-wrap: anywhere; }
.ranking-identidad strong { font-size: .88rem; }
.ranking-identidad small { font-size: .73rem; color: #b8ceda; }
.ranking-porcentaje { color: #8eecd5; white-space: nowrap; font-size: .95rem; }
.ranking-vacio { padding: 20px 0; }
@media (max-width: 1050px) { .ranking-columnas { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .ranking-filtros, .ranking-filtros label, .ranking-filtros button { width: 100%; } .ranking-filtros input, .ranking-filtros select { width: 100%; min-width: 0; } }

.estadisticas-hub {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin: 24px 0;
}
.estadisticas-hub button {
  min-height: 190px;
  padding: 22px;
  border: 1px solid rgba(91, 207, 255, .22);
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(7, 25, 35, .88), rgba(4, 18, 28, .96)),
    radial-gradient(circle at 100% 0%, rgba(91, 207, 255, .12), transparent 35%);
  color: #edf8fc;
  text-align: left;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.estadisticas-hub button:hover {
  transform: translateY(-3px);
  border-color: rgba(121, 227, 204, .48);
  box-shadow: 0 18px 36px rgba(0, 0, 0, .28);
}
.estadisticas-hub span {
  display: inline-flex;
  margin-bottom: 14px;
  padding: 6px 11px;
  border-radius: 999px;
  background: rgba(55, 230, 161, .14);
  color: #8ef1d8;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.estadisticas-hub strong {
  display: block;
  color: #fff;
  font-size: 1.25rem;
  line-height: 1.15;
}
.estadisticas-hub small {
  display: block;
  margin-top: 12px;
  color: #abc1cb;
  font-size: 15px;
  line-height: 1.45;
}
.estadisticas-volver-hub {
  width: fit-content;
  margin: 6px 0 16px;
}
#panelEstadisticas [data-estadisticas-view][hidden],
#panelEstadisticas .estadisticas-hub[hidden],
#btnVolverHubEstadisticas[hidden] {
  display: none !important;
}
body.tema-prueba-colores .estadisticas-hub button {
  border-color: rgba(255, 210, 63, .24);
  background:
    linear-gradient(145deg, rgba(26, 18, 8, .9), rgba(5, 20, 34, .92)),
    radial-gradient(circle at 100% 0%, rgba(255, 210, 63, .16), transparent 34%);
}
body.tema-prueba-colores .estadisticas-hub button:hover {
  border-color: rgba(255, 210, 63, .72);
  box-shadow: 0 20px 42px rgba(255, 210, 63, .12);
}
body.tema-prueba-colores .estadisticas-hub span {
  background: rgba(255, 210, 63, .18);
  color: #fff0a8;
}
@media (max-width: 1180px) { .estadisticas-hub { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px) { .estadisticas-hub { grid-template-columns: 1fr; } }

.lista-hub,
.dashboard-hub {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin: 24px 0;
}
.lista-hub { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lista-hub button,
.dashboard-hub button {
  min-height: 180px;
  padding: 22px;
  border: 1px solid rgba(91, 207, 255, .22);
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(7, 25, 35, .88), rgba(4, 18, 28, .96)),
    radial-gradient(circle at 100% 0%, rgba(91, 207, 255, .12), transparent 35%);
  color: #edf8fc;
  text-align: left;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.lista-hub button:hover,
.dashboard-hub button:hover {
  transform: translateY(-3px);
  border-color: rgba(121, 227, 204, .48);
  box-shadow: 0 18px 36px rgba(0, 0, 0, .28);
}
.lista-hub span,
.dashboard-hub span {
  display: inline-flex;
  margin-bottom: 14px;
  padding: 6px 11px;
  border-radius: 999px;
  background: rgba(55, 230, 161, .14);
  color: #8ef1d8;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.lista-hub strong,
.dashboard-hub strong {
  display: block;
  color: #fff;
  font-size: 1.25rem;
  line-height: 1.15;
}
.lista-hub small,
.dashboard-hub small {
  display: block;
  margin-top: 12px;
  color: #abc1cb;
  font-size: 15px;
  line-height: 1.45;
}
.lista-volver-hub,
.dashboard-volver-hub {
  width: fit-content;
  margin: 6px 0 16px;
}
#panelLista [data-lista-view][hidden],
#panelLista .lista-hub[hidden],
#btnVolverHubLista[hidden],
#panelDashboard [data-dashboard-view][hidden],
#panelDashboard .dashboard-hub[hidden],
#btnVolverHubDashboard[hidden] {
  display: none !important;
}
body.tema-prueba-colores .lista-hub button,
body.tema-prueba-colores .dashboard-hub button {
  border-color: rgba(255, 210, 63, .24);
  background:
    linear-gradient(145deg, rgba(26, 18, 8, .9), rgba(5, 20, 34, .92)),
    radial-gradient(circle at 100% 0%, rgba(255, 210, 63, .16), transparent 34%);
}
body.tema-prueba-colores .lista-hub button:hover,
body.tema-prueba-colores .dashboard-hub button:hover {
  border-color: rgba(255, 210, 63, .72);
  box-shadow: 0 20px 42px rgba(255, 210, 63, .12);
}
body.tema-prueba-colores .lista-hub span,
body.tema-prueba-colores .dashboard-hub span {
  background: rgba(255, 210, 63, .18);
  color: #fff0a8;
}
@media (max-width: 1180px) { .lista-hub, .dashboard-hub { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px) { .lista-hub, .dashboard-hub { grid-template-columns: 1fr; } }

#panelJugadoras .accionesJugadoras[hidden],
#panelJugadoras .acciones-masivas-jugadoras[hidden],
#panelEquipos .equipos-filtros[hidden] {
  display: none !important;
}

#panelUsuarios .usuarios-form-card[hidden],
#panelUsuarios #usuariosListadoTitulo[hidden],
#panelUsuarios .usuarios-toolbar[hidden],
#panelUsuarios #listaUsuarios[hidden] {
  display: none !important;
}

#panelUsuarios .usuarios-accesos {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
  margin: 18px 0 22px;
  padding: 18px;
  border: 1px solid rgba(83, 200, 255, .14);
  border-radius: 18px;
  background: rgba(5, 19, 28, .62);
}

#panelUsuarios .usuarios-accesos button {
  display: grid;
  gap: 8px;
  min-height: 96px;
  padding: 18px;
  border: 1px solid rgba(83, 200, 255, .18);
  border-radius: 16px;
  background:
    linear-gradient(145deg, rgba(7, 26, 38, .9), rgba(6, 18, 27, .86)),
    radial-gradient(circle at 100% 100%, rgba(55, 230, 161, .13), transparent 34%);
  color: var(--color-text);
  cursor: pointer;
  text-align: left;
}

#panelUsuarios .usuarios-accesos strong {
  color: #f5fbff;
  font-size: 1.18rem;
  line-height: 1.1;
}

#panelUsuarios .usuarios-accesos span {
  color: #98dff5;
  font-weight: 800;
}

#panelUsuarios .usuarios-accesos button:hover,
#panelUsuarios .usuarios-accesos button.activo {
  border-color: rgba(255, 210, 63, .68);
  background:
    linear-gradient(145deg, rgba(34, 27, 10, .94), rgba(7, 25, 34, .9)),
    radial-gradient(circle at 100% 100%, rgba(255, 210, 63, .2), transparent 38%);
  box-shadow: 0 18px 34px rgba(0, 0, 0, .22), 0 0 28px rgba(255, 210, 63, .1);
  transform: translateY(-2px);
}

#panelPizarra .pizarra-layout[hidden],
#panelPizarra .pizarra-hub[hidden] {
  display: none !important;
}

#panelPizarra .pizarra-hub {
  display: grid;
  grid-template-columns: minmax(240px, 520px);
  gap: 14px;
  margin: 18px 0 22px;
  padding: 18px;
  border: 1px solid rgba(83, 200, 255, .14);
  border-radius: 18px;
  background: rgba(5, 19, 28, .62);
}

#panelPizarra .pizarra-hub button {
  display: grid;
  gap: 8px;
  min-height: 104px;
  padding: 20px;
  border: 1px solid rgba(83, 200, 255, .18);
  border-radius: 16px;
  background:
    linear-gradient(145deg, rgba(7, 26, 38, .9), rgba(6, 18, 27, .86)),
    radial-gradient(circle at 100% 100%, rgba(55, 230, 161, .13), transparent 34%);
  color: var(--color-text);
  cursor: pointer;
  text-align: left;
}

#panelPizarra .pizarra-hub strong {
  color: #f5fbff;
  font-size: 1.22rem;
  line-height: 1.1;
}

#panelPizarra .pizarra-hub span {
  color: #98dff5;
  font-weight: 800;
}

#panelPizarra .pizarra-hub button:hover {
  border-color: rgba(255, 210, 63, .68);
  background:
    linear-gradient(145deg, rgba(34, 27, 10, .94), rgba(7, 25, 34, .9)),
    radial-gradient(circle at 100% 100%, rgba(255, 210, 63, .2), transparent 38%);
  box-shadow: 0 18px 34px rgba(0, 0, 0, .22), 0 0 28px rgba(255, 210, 63, .1);
  transform: translateY(-2px);
}

#panelPizarra .pizarra-volver-hub {
  width: fit-content;
  margin-bottom: 16px;
}

#panelJugadoras .tabs-equipos-hub {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
  padding: 18px;
  border: 1px solid rgba(83, 200, 255, .14);
  border-radius: 18px;
  background: rgba(5, 19, 28, .62);
}

#panelJugadoras .tab-equipo-hub {
  display: grid;
  gap: 8px;
  min-height: 112px;
  padding: 20px;
  border: 1px solid rgba(83, 200, 255, .18);
  border-radius: 16px;
  background:
    linear-gradient(145deg, rgba(7, 26, 38, .9), rgba(6, 18, 27, .86)),
    radial-gradient(circle at 100% 100%, rgba(55, 230, 161, .13), transparent 34%);
  color: var(--color-text);
  cursor: pointer;
  text-align: left;
}

#panelJugadoras .tab-equipo-hub strong {
  color: #f5fbff;
  font-size: 1.25rem;
  line-height: 1.1;
}

#panelJugadoras .tab-equipo-hub span {
  color: #98dff5;
  font-weight: 800;
}

#panelJugadoras .tab-equipo-hub:hover {
  border-color: rgba(255, 210, 63, .55);
  transform: translateY(-2px);
  box-shadow: 0 18px 34px rgba(0, 0, 0, .22), 0 0 28px rgba(255, 210, 63, .08);
}

#panelEquipos .equipos-selector-limpio {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 14px;
  margin-top: 20px;
  padding: 18px;
  border: 1px solid rgba(83, 200, 255, .14);
  border-radius: 18px;
  background: rgba(5, 19, 28, .62);
}

#panelEquipos .equipo-selector-boton {
  display: grid;
  gap: 8px;
  min-height: 96px;
  padding: 18px;
  border: 1px solid rgba(83, 200, 255, .18);
  border-radius: 16px;
  background:
    linear-gradient(145deg, rgba(7, 26, 38, .9), rgba(6, 18, 27, .86)),
    radial-gradient(circle at 100% 100%, rgba(55, 230, 161, .13), transparent 34%);
  color: var(--color-text);
  cursor: pointer;
  text-align: left;
}

#panelEquipos .equipo-selector-boton strong {
  color: #f5fbff;
  font-size: 1.18rem;
  line-height: 1.1;
}

#panelEquipos .equipo-selector-boton span {
  color: #98dff5;
  font-weight: 800;
}
.equipo-plantilla-badge,#panelEquipos .equipo-selector-boton .equipo-plantilla-badge,#panelEquipos .equipo-card-stats .equipo-plantilla-badge{display:inline-flex!important;align-items:center;width:fit-content;max-width:100%;padding:7px 12px;border:1px solid #58d5b5;border-radius:12px;background:#103c34;color:#d5fff2;font-size:17px;font-weight:800;line-height:1.3;white-space:normal;visibility:visible;opacity:1}
@media(max-width:600px){#panelEquipos #equiposResumenPremium{grid-template-columns:repeat(2,minmax(0,1fr))}#panelEquipos .panel-resumen-premium-card{min-width:0;padding:12px}#panelEquipos .panel-resumen-premium-etiqueta{font-size:10px;letter-spacing:.03em;max-width:100%;overflow-wrap:anywhere;box-sizing:border-box}#panelEquipos .panel-resumen-premium-card span{font-size:12px}}

.biblioteca-ejercicios {
  margin: 28px 0;
  padding: 24px;
  border: 1px solid rgba(83, 200, 255, .24);
  border-radius: 18px;
  background: rgba(6, 23, 34, .84);
  color: var(--color-text);
  scroll-margin-top: 24px;
}

.biblioteca-ejercicios [hidden],
.biblioteca-ejercicios[hidden] { display: none !important; }
.ejercicios-cabecera { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.ejercicios-cabecera h3 { margin: 8px 0; color: #f5fbff; font-size: 24px; }
#panelCrearSesion .biblioteca-ejercicios .btn-crear { background: #74e0bd; color: #08251e; border-color: #74e0bd; }
#panelCrearSesion .biblioteca-ejercicios .btn-crear:hover { background: #a4efd5; }
.ejercicios-cabecera p, .ejercicios-nota, .ejercicios-importar p { color: var(--color-text-muted); line-height: 1.6; }
.ejercicios-eyebrow { color: #79e2c3; font-size: 11px; font-weight: 800; letter-spacing: .1em; }
.ejercicios-nota { font-size: 12px; margin: 12px 0 20px; }
.ejercicios-filtros, .ejercicio-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.biblioteca-ejercicios label { display: grid; gap: 7px; margin: 0; color: var(--color-text); font-size: 13px; font-weight: 700; }
.biblioteca-ejercicios input, .biblioteca-ejercicios select, .biblioteca-ejercicios textarea {
  box-sizing: border-box; width: 100%; min-width: 0; padding: 11px 12px; border: 1px solid rgba(137, 180, 207, .3);
  border-radius: 9px; background: #0a1c29; color: #f5fbff; font: inherit;
}
.biblioteca-ejercicios textarea { resize: vertical; line-height: 1.5; }
.biblioteca-ejercicios button:focus-visible, .biblioteca-ejercicios input:focus-visible,
.biblioteca-ejercicios select:focus-visible, .biblioteca-ejercicios textarea:focus-visible {
  outline: 3px solid #ffd23f; outline-offset: 3px;
}
.ejercicios-estado { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 16px 0; color: var(--color-text-muted); }
.ejercicios-feedback { color: #8eebd2; line-height: 1.5; overflow-wrap: anywhere; }
.ejercicios-feedback:not(:empty) { margin: 14px 0; padding: 12px; border-radius: 9px; background: rgba(34, 144, 113, .14); }
.ejercicios-feedback.es-error, .ejercicio-form [role="alert"] { color: #ffb3b3; }
.ejercicios-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 245px), 1fr)); gap: 14px; margin-top: 18px; }
.ejercicio-tarjeta { overflow: hidden; min-width: 0; border: 1px solid rgba(83, 200, 255, .2); border-radius: 14px; background: #0d2534; }
.ejercicio-anadir { display: flex; flex-direction: column; gap: 10px; width: 100%; min-height: 230px; padding: 18px; border: 0; background: transparent; color: #f5fbff; text-align: left; font: inherit; cursor: pointer; }
.ejercicio-anadir:hover { background: rgba(83, 200, 255, .08); }
.ejercicio-anadir strong { font-size: 18px; line-height: 1.3; overflow-wrap: anywhere; }
.ejercicio-objetivo { align-self: flex-start; padding: 4px 9px; border-radius: 16px; background: rgba(72, 215, 173, .13); color: #9be8d2; font-size: 12px; overflow-wrap: anywhere; }
.ejercicio-meta { color: #a7c2d4; font-size: 12px; }
.ejercicio-descripcion { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; color: #d7e3eb; font-size: 13px; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.ejercicio-cta { margin-top: auto; color: #ffe17a; font-weight: 800; font-size: 13px; }
.ejercicio-acciones { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 16px 16px; }
.ejercicio-acciones .btn-pro { min-height: 36px; font-size: 12px; padding: 7px 12px; }
.ejercicios-vacio { grid-column: 1 / -1; padding: 28px 18px; text-align: center; border: 1px dashed rgba(137, 180, 207, .3); border-radius: 12px; color: #b9cedd; }
.ejercicio-form { display: grid; gap: 16px; margin: 20px 0; padding: 20px; border: 1px solid rgba(121, 226, 195, .4); border-radius: 12px; background: #102b39; }
.ejercicio-form h4 { margin: 0; color: #f5fbff; font-size: 19px; }
.ejercicio-form-actions, .ejercicios-origen-bloques { display: flex; gap: 10px; flex-wrap: wrap; }
.ejercicio-recursos-editor > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 10px 0; }
.ejercicio-recursos-editor span { overflow-wrap: anywhere; min-width: 0; }
.ejercicios-importar { margin-top: 24px; padding-top: 18px; border-top: 1px solid rgba(137, 180, 207, .2); }
.ejercicios-importar summary { cursor: pointer; color: #98dff5; font-weight: 700; }
.ejercicios-origen-bloques { margin-top: 14px; }
.ejercicio-guardar-bloque { margin-top: 18px; }
@media (max-width: 680px) {
  .biblioteca-ejercicios { padding: 16px; }
  .ejercicios-cabecera { flex-direction: column; }
  .ejercicios-filtros, .ejercicio-form-grid { grid-template-columns: 1fr; }
  .ejercicio-form { padding: 14px; }
}

#panelEquipos .equipo-selector-boton:hover,
#panelEquipos .equipo-selector-boton.activo {
  border-color: rgba(255, 210, 63, .68);
  background:
    linear-gradient(145deg, rgba(34, 27, 10, .94), rgba(7, 25, 34, .9)),
    radial-gradient(circle at 100% 100%, rgba(255, 210, 63, .2), transparent 38%);
  box-shadow: 0 18px 34px rgba(0, 0, 0, .22), 0 0 28px rgba(255, 210, 63, .1);
  transform: translateY(-2px);
}
.ejercicio-ilustracion {
  width: 100%;
  height: 180px;
  object-fit: contain;
  background: #fff;
  border-radius: 10px;
}

#bibliotecaEjercicios .ejercicio-acciones {
  flex-wrap: wrap;
}

#bibliotecaEjercicios [data-ex="more"] {
  margin: 16px 0;
}

.fisico-comparativa { margin:24px 0; }
.fisico-comparar-controles, .fisico-comparar-tarjetas { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:16px 0; }
.fisico-comparar-controles select { width:100%; min-width:0; min-height:46px; padding:10px; background:#06121b; color:#f4faff; border:1px solid #527280; border-radius:9px; font:inherit; }
.fisico-comparar-tarjetas article { min-width:0; padding:16px; border:1px solid #294955; border-radius:12px; }
.fisico-comparar-tarjetas p { overflow-wrap:anywhere; }
.fisico-comparar-tarjetas meter { display:block; width:100%; height:22px; margin-bottom:16px; }
.fisico-comparar-tarjetas strong { display:block; margin-top:18px; color:#edf8fc; }
@media(max-width:600px) { .fisico-comparar-controles, .fisico-comparar-tarjetas { grid-template-columns:1fr; } }

.jugadora-peso-cambio { margin:20px 0; padding:20px; border:1px solid #294955; border-radius:16px; background:#091c28; color:#edf8fc; }
.jugadora-peso-cambio h3 { margin:0 0 16px; }
.jugadora-peso-valores { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.jugadora-peso-valores > div { display:grid; gap:8px; min-width:0; padding:16px; background:#102b39; border-radius:12px; }
.jugadora-peso-valores strong { font-size:1.8rem; color:#edf8fc; }
.jugadora-peso-valores span, .jugadora-peso-valores small { color:#b9cdd9; overflow-wrap:anywhere; }
@media(max-width:600px) { .jugadora-peso-valores { grid-template-columns:1fr; } }

.equipo-justificacion-dialog{width:min(560px,calc(100vw - 32px));box-sizing:border-box;border:1px solid #cbd5e1;border-radius:18px;padding:24px;background:#fff;color:#16212b;box-shadow:0 20px 70px #0004}
.equipo-justificacion-dialog::backdrop{background:#10233099}
.equipo-justificacion-dialog h3{margin:0 0 12px;font-size:22px}
.equipo-justificacion-dialog p{line-height:1.5}
.equipo-justificacion-dialog label{display:block;font-weight:600;margin:16px 0 8px}
.equipo-justificacion-dialog textarea{width:100%;box-sizing:border-box;padding:12px;border:1px solid #94a3b8;border-radius:10px;font:inherit;resize:vertical;min-height:110px}
.equipo-justificacion-acciones{display:flex;justify-content:flex-end;gap:12px;flex-wrap:wrap;margin-top:16px}
#errorJustificacionEquipo{color:#b42318}
.equipo-justificacion-estado{color:#087c66;margin:12px 0}
@media(max-width:600px){.equipo-justificacion-dialog{padding:18px}.equipo-justificacion-acciones{flex-direction:column}.equipo-justificacion-acciones button{width:100%}}

.equipo-justificacion-dialog h3{color:#16212b}
.equipo-justificacion-dialog textarea{background:#fff;color:#16212b}
.equipo-justificacion-dialog textarea::placeholder{color:#64748b;opacity:1}

#dialogJustificarEquipo #tituloJustificacionEquipo{color:#16212b;text-shadow:none}
.ejercicio-form [data-ex="sharing"]{border:1px solid #47616d;border-radius:12px;padding:16px;margin:16px 0}
.ejercicio-form [data-ex="sharing-teams"]{display:flex;flex-wrap:wrap;gap:12px}
.ejercicio-form [data-ex="sharing-teams"] label{display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid #47616d;border-radius:8px}
.ejercicio-form [data-ex="sharing-teams"] input{width:20px;height:20px}
#usuarioEquiposOpciones select[data-team-staff]{max-width:100%;margin-left:12px}
#pizarraRemoteStatus{padding:12px 16px;border-left:4px solid #52d7ba;background:#0c2630;line-height:1.5}
#pizarraRemoteStatus[role="alert"]{border-color:#ff837a;color:#ffbdb8}
.club-team-logo{width:64px;height:64px;object-fit:contain;border-radius:50%;flex-shrink:0;display:block}
.equipo-card-icono .club-team-logo,.equipo-detalle-icono .club-team-logo{width:100%;height:100%;max-width:92px;max-height:92px}
.partidos-card>.club-team-logo{width:80px;height:80px;margin-bottom:16px}
.club-team-logo-small{width:24px;height:24px;display:inline-block;vertical-align:middle;margin-right:6px}
.player-space-panel{padding:32px;overflow-wrap:anywhere}.player-space-panel>h1{font-size:clamp(26px,4vw,40px)}.player-space-panel p{line-height:1.6}.player-space-panel article{margin:16px 0;padding:20px}
.player-notice-dialog{width:min(600px,calc(100% - 32px));background:#102733;color:#eef6fa;border:1px solid #47616d;border-radius:16px;padding:24px}.player-notice-dialog::backdrop{background:#000b}.player-notice-dialog form{display:grid;gap:12px}.player-notice-dialog input,.player-notice-dialog textarea{width:100%;box-sizing:border-box;font:inherit;padding:12px}.player-notice-dialog button{font:inherit;padding:12px;cursor:pointer}

@media (max-width: 900px) {
  body.sidebar-mobile-open #sidebar { opacity: 1 !important; visibility: visible !important; pointer-events: auto; z-index: 1100; }
  body.sidebar-mobile-open .panel.visible { z-index: auto; }
  #sidebarToggle { cursor: pointer; }
}
.match-calendar .partidos-header{display:flex;justify-content:space-between;align-items:center;gap:20px}.match-calendar h1{font-size:36px;margin:8px 0}.match-calendar p{line-height:1.6;color:#a8bdcb}.match-calendar .partidos-eyebrow{color:#48dfba;font-size:13px;font-weight:700;letter-spacing:2px}.match-calendar .partidos-notice{border-left:3px solid #48dfba;background:#0b202b;padding:16px 20px;margin:24px 0}.match-calendar .partidos-settings{background:#0b202b;padding:18px;border:1px solid #294653;border-radius:12px;margin:18px 0}.match-calendar summary{cursor:pointer;font-weight:700}.match-calendar .partidos-binding{display:flex;gap:12px;align-items:end;margin:16px 0;flex-wrap:wrap}.match-calendar .partidos-binding label{display:grid;gap:8px;flex:1;min-width:220px}.match-calendar select{color:#eef6fa;background:#102733;border:1px solid #294653;padding:12px;border-radius:10px;font:inherit;max-width:100%}.match-calendar .partidos-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}.match-calendar .partidos-card{background:#0c1f2a;border:1px solid #213e4b;border-radius:18px;padding:22px}.match-calendar .partidos-card small{display:block;color:#9eb6c5;margin:8px 0}.match-calendar .partidos-card h2{font-size:23px;margin:12px 0}.match-calendar .partidos-tag{display:inline-block;padding:5px 10px;background:#153d3d;border-radius:20px;color:#6ff4ce;font-size:12px}.match-calendar .partidos-rival{font-size:22px;color:#fff;font-weight:700}.match-calendar .partidos-date{font-size:26px;font-weight:750;color:#62cdf5;margin:18px 0 6px}.match-calendar a{color:#6bd3ff}.match-calendar .partidos-error{color:#ffb8ad}.match-calendar .partidos-controls{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:30px 0 18px}.match-calendar .partidos-controls h2{margin:0 auto 0 0;font-size:23px}.match-calendar .partidos-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px}.match-calendar .partidos-weekday{color:#98afbe;text-align:center;font-size:12px;padding:6px}.match-calendar .partidos-day{min-height:95px;border:1px solid #203b49;border-radius:12px;padding:8px;background:#0b1c26;overflow-wrap:anywhere}.match-calendar .partidos-empty{visibility:hidden}.match-calendar .partidos-event{display:block;border-radius:6px;padding:5px;margin-top:5px;font-size:11px;line-height:1.4;background:#15403f;color:#8cf4d3}.match-calendar .partidos-list{margin-top:24px;display:grid;gap:10px}.match-calendar .partidos-match{display:grid;grid-template-columns:140px 1fr 1fr;gap:16px;padding:18px;border:1px solid #203b49;border-radius:12px;background:#0c1f2a}.match-calendar .partidos-match p{margin:6px 0}.match-calendar button:disabled{opacity:.5;cursor:wait}@media(max-width:800px){.match-calendar .partidos-header{align-items:start;flex-wrap:wrap}.match-calendar h1{font-size:28px}.match-calendar .partidos-match{grid-template-columns:1fr}.match-calendar .partidos-day{min-height:65px;padding:4px}.match-calendar .partidos-event{font-size:9px;padding:3px}}
#workspaceNavigation {
  display: grid;
  gap: 8px;
  padding: 12px;
}
#workspaceNavigation button, #workspaceNavigation a, .workspace-password button {
  padding: 10px 14px;
  border: 1px solid currentColor;
  border-radius: 8px;
  background: #17233b;
  color: #fff;
  font: inherit;
  cursor: pointer;
}
#workspaceNavigation [aria-pressed="true"] { background: #285891; }
#workspaceNavigation :focus-visible, .workspace-password :focus-visible { outline: 3px solid #69c9ff; outline-offset: 3px; }
#workspaceHeading { padding: 14px 20px; margin-bottom: 16px; background: #17233b; color: #fff; border-radius: 10px; font-weight: 700; }
#workspaceHeading { display: flex; align-items: center; gap: 12px; min-width: 0; }
#workspaceHeading img { width: 50px; height: 50px; object-fit: contain; flex: 0 0 50px; }
#workspaceHeading .workspace-brand-details { display: grid; gap: 4px; min-width: 0; overflow-wrap: anywhere; }
#workspaceHeading strong { font-size: 1.1rem; line-height: 1.3; }
#workspaceHeading span { font-size: .8rem; line-height: 1.4; font-weight: 400; color: #c9dbe9; }
#workspaceHeading[hidden], .workspace-readonly [data-workspace-mutation="true"] { display: none !important; }
.initial-load-status { padding: 16px 20px; margin: 12px 0; border: 1px solid #7694bd; border-radius: 10px; color: #fff; background: #17233b; line-height: 1.6; }
.initial-load-status[hidden] { display: none !important; }
.initial-load-status button { margin: 8px; }
.workspace-password { width: min(460px, calc(100vw - 32px)); max-height: 90vh; overflow: auto; border: 1px solid #7694bd; border-radius: 12px; padding: 24px; background: #17233b; color: #fff; }
.workspace-password::backdrop { background: #0009; }
.workspace-password form, .workspace-password label { display: grid; gap: 10px; }
.workspace-password form { gap: 18px; }
.workspace-password input { width: 100%; box-sizing: border-box; padding: 10px; border: 1px solid #7694bd; border-radius: 6px; background: #fff; color: #15203a; font: inherit; }
.workspace-password [role="alert"] { color: #ffb9c4; margin: 0; }
.workspace-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-end; }
#btnPanelJugadoras { display: none !important; }
.plantilla-buscador { width: 100%; max-width: 560px; box-sizing: border-box; margin: 16px 0; padding: 14px; border: 1px solid #47616d; border-radius: 12px; background: #0b2531; color: #efffff; font: inherit; }
.plantilla-acciones { display: flex; flex-wrap: wrap; gap: 12px; }
.plantilla-acciones .btn-pro { flex: 0 1 auto; width: auto; color: #061b24; background: #71ddc8; }
.jugadoras-equipo-cabecera > button { justify-self: start; width: auto; }
#jugadorasEquipoVista .jugadora-selector { width: 20px; height: 20px; min-width: 20px; min-height: 20px; }