.livemap-admin-panel{max-width:900px;margin:0 auto 14px;padding:12px 16px;border-radius:10px;border:1px solid rgba(168,85,247,.4);background:rgba(168,85,247,.06);}
.livemap-admin-title{font-weight:700;color:#c084fc;margin-bottom:4px;}
.livemap-admin-hint{font-size:.8em;opacity:.7;margin:0 0 10px;}
.livemap-admin-warning{font-size:.85em;color:#facc15;}
.livemap-admin-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.livemap-admin-row label{font-size:.85em;opacity:.85;}
.livemap-admin-row select{padding:6px 10px;border-radius:6px;border:1px solid rgba(120,120,120,.4);background:var(--card-bg,#1c1f26);color:inherit;}
.livemap-admin-apply-btn{padding:6px 16px;border-radius:8px;border:1px solid #a855f7;background:rgba(168,85,247,.15);color:#c084fc;font-weight:600;cursor:pointer;}
.livemap-admin-apply-btn:hover{background:rgba(168,85,247,.3);}
.livemap-admin-apply-btn:disabled{opacity:.5;cursor:default;}
.livemap-admin-status{font-size:.82em;opacity:.8;}

.livemap-wrap{max-width:900px;margin:0 auto;}
.livemap-toolbar{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap;}
.livemap-toolbar label{font-weight:600;}
.livemap-toolbar select{padding:6px 10px;border-radius:6px;border:1px solid rgba(120,120,120,.4);background:var(--card-bg,#1c1f26);color:inherit;}
.livemap-total{opacity:.7;font-size:.9em;margin-left:auto;}
.livemap-canvas-scroll{width:100%;aspect-ratio:1/1;overflow:auto;border:1px solid rgba(120,120,120,.35);border-radius:10px;}
.livemap-canvas{position:relative;width:640px;height:640px;transform-origin:0 0;background:
	linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px) 0 0/12.5% 12.5%,
	linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px) 0 0/12.5% 12.5%,
	radial-gradient(circle at 30% 20%, rgba(90,140,90,.18), transparent 60%),
	#12151b;}
.livemap-zone-label{position:absolute;transform:translate(-50%,-50%);font-size:.72em;color:rgba(255,255,255,.45);white-space:nowrap;pointer-events:none;text-shadow:0 1px 2px #000;padding:2px 6px;border-radius:6px;transition:background .15s ease, color .15s ease;}
/* Modo teleport activo -- los spots se vuelven clickeables (ver mapa-en-vivo.js, toggleTeleportMode) */
.livemap-canvas.is-teleport-mode{cursor:crosshair;}
.livemap-canvas.is-teleport-mode .livemap-zone-label{pointer-events:auto;cursor:pointer;color:#f2c94c;background:rgba(242,201,76,.14);}
.livemap-canvas.is-teleport-mode .livemap-zone-label:hover{background:rgba(242,201,76,.32);color:#fff;}
.livemap-players{position:absolute;inset:0;}
.livemap-player{position:absolute;transform:translate(-50%,-100%);display:flex;flex-direction:column;align-items:center;transition:left 1s linear, top 1s linear;z-index:1;}
.livemap-player img{width:28px;height:28px;border-radius:50%;border:2px solid #f2c94c;object-fit:cover;box-shadow:0 0 6px rgba(0,0,0,.6);}
.livemap-player-name{margin-top:2px;font-size:.68em;background:rgba(0,0,0,.6);color:#fff;padding:1px 5px;border-radius:4px;white-space:nowrap;}
.livemap-player-mine{z-index:5;}
.livemap-player-mine img{border-color:#4ade80;box-shadow:0 0 0 3px rgba(74,222,128,.35),0 0 10px rgba(74,222,128,.7);}
.livemap-player-mine .livemap-player-name{background:rgba(74,222,128,.85);color:#06240f;font-weight:700;}
.livemap-hint{margin-top:8px;font-size:.8em;opacity:.6;}
.livemap-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.5);font-size:.9em;}

.livemap-zoom-controls{display:flex;align-items:center;gap:6px;margin-left:auto;}
.livemap-zoom-btn{width:28px;height:28px;border-radius:6px;border:1px solid rgba(120,120,120,.4);background:var(--card-bg,#1c1f26);color:inherit;cursor:pointer;font-size:1em;line-height:1;}
.livemap-zoom-btn:hover{background:rgba(242,201,76,.18);}
.livemap-zoom-level{font-size:.8em;opacity:.7;min-width:38px;text-align:center;}

.livemap-control-panel{margin-top:16px;padding:14px;border:1px solid rgba(120,120,120,.35);border-radius:10px;background:rgba(255,255,255,.03);display:flex;flex-wrap:wrap;align-items:center;gap:14px;}
.livemap-connect-btn{padding:8px 16px;border-radius:8px;border:1px solid #f2c94c;background:rgba(242,201,76,.12);color:#f2c94c;font-weight:600;cursor:pointer;}
.livemap-connect-btn:hover{background:rgba(242,201,76,.22);}
.livemap-connect-btn:disabled{opacity:.5;cursor:default;}
.livemap-teleport-btn{padding:8px 16px;border-radius:8px;border:1px solid #38bdf8;background:rgba(56,189,248,.12);color:#38bdf8;font-weight:600;cursor:pointer;}
.livemap-teleport-btn:hover{background:rgba(56,189,248,.22);}
.livemap-teleport-btn.is-active{background:rgba(56,189,248,.4);color:#fff;}
.livemap-control-status{font-size:.85em;opacity:.75;}

.livemap-teleport-panel{display:flex;flex-direction:column;gap:6px;width:100%;padding:10px 12px;border-radius:8px;border:1px solid rgba(56,189,248,.3);background:rgba(56,189,248,.05);}
.livemap-teleport-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.livemap-teleport-row label{font-size:.82em;opacity:.8;min-width:82px;}
.livemap-teleport-row select{padding:5px 8px;border-radius:6px;border:1px solid rgba(120,120,120,.4);background:var(--card-bg,#1c1f26);color:inherit;flex:1;min-width:140px;}
.livemap-coord-input{width:64px;padding:5px 6px;border-radius:6px;border:1px solid rgba(120,120,120,.4);background:var(--card-bg,#1c1f26);color:inherit;}
.livemap-teleport-go-btn{padding:5px 14px;border-radius:6px;border:1px solid #38bdf8;background:rgba(56,189,248,.15);color:#38bdf8;font-weight:600;cursor:pointer;}
.livemap-teleport-go-btn:hover{background:rgba(56,189,248,.3);}
.livemap-teleport-go-btn:disabled{opacity:.4;cursor:default;}
.livemap-teleport-error{font-size:.78em;color:#f87171;min-height:1.1em;}
.livemap-dpad{display:grid;grid-template-areas:"nw n ne" "w c e" "sw s se";gap:4px;width:132px;}
.livemap-dpad-btn{width:40px;height:40px;border-radius:8px;border:1px solid rgba(120,120,120,.4);background:var(--card-bg,#1c1f26);color:inherit;font-size:1.1em;cursor:pointer;}
.livemap-dpad-btn:hover{background:rgba(242,201,76,.18);}
.livemap-dpad-btn:active{transform:scale(0.92);}

.livemap-attack-panel{display:flex;flex-direction:column;gap:8px;min-width:200px;max-width:280px;}
.livemap-targets-btn{padding:8px 14px;border-radius:8px;border:1px solid #ef4444;background:rgba(239,68,68,.12);color:#ef4444;font-weight:600;cursor:pointer;}
.livemap-targets-btn:hover{background:rgba(239,68,68,.22);}
.livemap-targets-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;max-height:180px;overflow-y:auto;}
.livemap-target-item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 10px;border-radius:6px;border:1px solid rgba(120,120,120,.3);background:rgba(255,255,255,.03);font-size:.82em;}
.livemap-target-item.is-monster{border-color:rgba(239,68,68,.4);}
.livemap-target-item.is-player{border-color:rgba(96,165,250,.4);}
.livemap-target-attack-btn{padding:3px 10px;border-radius:6px;border:1px solid #ef4444;background:rgba(239,68,68,.15);color:#ef4444;cursor:pointer;font-size:.85em;}
.livemap-target-attack-btn:hover{background:rgba(239,68,68,.3);}
.livemap-targets-empty{font-size:.82em;opacity:.6;padding:6px 0;}

.livemap-quick-actions{display:flex;gap:8px;margin-top:4px;}
.livemap-quick-btn{flex:1;padding:6px 10px;border-radius:8px;border:1px solid #34d399;background:rgba(52,211,153,.12);color:#34d399;font-weight:600;cursor:pointer;font-size:.82em;}
.livemap-quick-btn:hover{background:rgba(52,211,153,.24);}

.livemap-skills-panel{display:flex;flex-direction:column;gap:8px;min-width:200px;max-width:280px;}
.livemap-skills-btn{padding:8px 14px;border-radius:8px;border:1px solid #38bdf8;background:rgba(56,189,248,.12);color:#38bdf8;font-weight:600;cursor:pointer;}
.livemap-skills-btn:hover{background:rgba(56,189,248,.22);}
.livemap-skill-selected{font-size:.8em;opacity:.8;}
.livemap-skills-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;max-height:180px;overflow-y:auto;}
.livemap-skill-item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 10px;border-radius:6px;border:1px solid rgba(120,120,120,.3);background:rgba(255,255,255,.03);font-size:.82em;cursor:pointer;}
.livemap-skill-item:hover{background:rgba(56,189,248,.12);}
.livemap-skill-item.is-selected{border-color:#38bdf8;background:rgba(56,189,248,.22);}
.livemap-skill-item.is-combo-1{border-color:#facc15;background:rgba(250,204,21,.18);}
.livemap-skill-item.is-combo-2{border-color:#fb923c;background:rgba(251,146,60,.18);}
.livemap-skill-item.is-combo-3{border-color:#f472b6;background:rgba(244,114,182,.18);}
.livemap-combo-toggle{font-size:.8em;opacity:.85;display:flex;align-items:center;gap:6px;}
.livemap-combo-sequence{font-size:.78em;opacity:.85;color:#facc15;}
.livemap-target-combo-btn{padding:3px 10px;border-radius:6px;border:1px solid #facc15;background:rgba(250,204,21,.15);color:#facc15;cursor:pointer;font-size:.85em;margin-left:4px;}
.livemap-target-combo-btn:hover{background:rgba(250,204,21,.3);}

.livemap-autohunt-panel{display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-width:220px;}
.livemap-autohunt-panel label{font-size:.85em;opacity:.8;}
.livemap-autohunt-range{width:52px;padding:5px 6px;border-radius:6px;border:1px solid rgba(120,120,120,.4);background:var(--card-bg,#1c1f26);color:inherit;}
.livemap-autohunt-btn{padding:7px 14px;border-radius:8px;border:1px solid #a855f7;background:rgba(168,85,247,.15);color:#c084fc;font-weight:600;cursor:pointer;}
.livemap-autohunt-btn:hover{background:rgba(168,85,247,.28);}
.livemap-autohunt-btn.is-active{background:rgba(168,85,247,.4);color:#fff;}
.livemap-autohunt-status{font-size:.8em;opacity:.75;width:100%;}

.livemap-hpbars{display:flex;flex-direction:column;gap:4px;min-width:160px;}
.livemap-bar{position:relative;height:16px;border-radius:8px;background:rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.12);overflow:hidden;}
.livemap-bar-fill{position:absolute;inset:0;width:100%;transition:width .4s ease-out;}
.livemap-bar-hp .livemap-bar-fill{background:linear-gradient(90deg,#dc2626,#ef4444);}
.livemap-bar-mp .livemap-bar-fill{background:linear-gradient(90deg,#1d4ed8,#3b82f6);}
.livemap-bar-label{position:relative;z-index:1;display:block;text-align:center;font-size:.68em;line-height:16px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.8);font-weight:600;}

/* Visor 2D en vivo -- "blobs" animados de lo que hay cerca mientras estas conectado por la web */
.livemap-entities{position:absolute;inset:0;pointer-events:none;}
.livemap-entity{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;transition:left .45s ease-out, top .45s ease-out;z-index:4;}
.livemap-entity-body{width:30px;height:30px;border-radius:50%;box-shadow:0 3px 8px rgba(0,0,0,.6);animation:livemap-bob 1s ease-in-out infinite;border:2px solid rgba(255,255,255,.75);}
.livemap-entity.is-monster .livemap-entity-body{background:radial-gradient(circle at 35% 30%, #fca5a5, #b91c1c 75%);}
.livemap-entity.is-player .livemap-entity-body{background:radial-gradient(circle at 35% 30%, #93c5fd, #1d4ed8 75%);}
.livemap-entity-name{margin-top:3px;font-size:.68em;font-weight:600;background:rgba(0,0,0,.7);color:#fff;padding:1px 5px;border-radius:4px;white-space:nowrap;}
.livemap-entity.is-walking .livemap-entity-body{animation:livemap-walk .45s ease-in-out;}
.livemap-entity.is-attacking .livemap-entity-body{animation:livemap-attack .4s ease-out;}
.livemap-entity.is-hit .livemap-entity-body{animation:livemap-hit .35s ease-out;}

@keyframes livemap-bob{
	0%,100%{transform:translateY(0) scale(1);}
	50%{transform:translateY(-7px) scale(1.08);}
}
@keyframes livemap-walk{
	0%,100%{transform:translateY(0) scaleX(1);}
	25%{transform:translateY(-5px) scaleX(0.92);}
	50%{transform:translateY(0) scaleX(1.08);}
	75%{transform:translateY(-3px) scaleX(0.95);}
}
@keyframes livemap-attack{
	0%{transform:scale(1);}
	35%{transform:scale(1.35);box-shadow:0 0 14px 4px rgba(255,255,255,.9);}
	100%{transform:scale(1);}
}
@keyframes livemap-hit{
	0%{filter:brightness(1);transform:translateX(0);}
	25%{filter:brightness(2.2);transform:translateX(-3px);}
	50%{filter:brightness(2.2);transform:translateX(3px);}
	100%{filter:brightness(1);transform:translateX(0);}
}

/* ===== Entrenamiento vs IA ===== */
.entrenamiento-wrap{max-width:720px;}

.entrenamiento-hero{position:relative;overflow:hidden;text-align:center;padding:38px 26px 32px;border-radius:18px;border:1px solid rgba(242,201,76,.35);background:
	radial-gradient(circle at 50% 0%, rgba(242,201,76,.14), transparent 60%),
	radial-gradient(circle at 85% 100%, rgba(124,124,242,.10), transparent 55%),
	linear-gradient(180deg, #171a22, #100f14);
	box-shadow:0 20px 60px -30px rgba(0,0,0,.8), 0 0 0 1px rgba(255,255,255,.02) inset;}
.entrenamiento-hero::after{content:'';position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.05) .5px, transparent .5px);background-size:14px 14px;opacity:.4;pointer-events:none;mix-blend-mode:overlay;}
.entrenamiento-hero-glow{position:absolute;inset:-40% -10% auto -10%;height:220px;background:radial-gradient(ellipse at center, rgba(239,68,68,.25), transparent 70%);filter:blur(10px);pointer-events:none;animation:entrenamiento-glow-pulse 5s ease-in-out infinite;}
@keyframes entrenamiento-glow-pulse{0%,100%{opacity:.55;transform:scale(1);}50%{opacity:.9;transform:scale(1.08);}}
.entrenamiento-hero-icon{position:relative;font-size:2.6em;filter:drop-shadow(0 0 12px rgba(242,201,76,.6));animation:entrenamiento-icon-float 3s ease-in-out infinite;}
@keyframes entrenamiento-icon-float{0%,100%{transform:translateY(0) rotate(-4deg);}50%{transform:translateY(-6px) rotate(4deg);}}
.entrenamiento-hero-title{position:relative;margin:10px 0 8px;font-size:1.6em;font-weight:800;letter-spacing:-.01em;background:linear-gradient(90deg,#f2c94c,#ef4444);-webkit-background-clip:text;background-clip:text;color:transparent;}
.entrenamiento-hero-text{position:relative;max-width:500px;margin:0 auto 22px;opacity:.85;line-height:1.55;font-size:.95em;}
.entrenamiento-warning{position:relative;color:#facc15;font-weight:600;margin-bottom:12px;}

.entrenamiento-step-label{max-width:600px;margin:0 auto 10px;text-align:left;font-size:.72em;font-weight:800;text-transform:uppercase;letter-spacing:.12em;color:#f2c94c;opacity:.8;}

/* ── Cartas de raza (chips con avatar, mismo asset/color que Desafíos Estratégicos) ─────── */
.entrenamiento-race{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;max-width:600px;margin:0 auto 22px;}
.entrenamiento-race-chip{position:relative;display:flex;flex-direction:column;align-items:center;gap:5px;width:84px;padding:10px 6px 8px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.03);color:#fff;cursor:pointer;font-size:.82em;transition:border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease;}
.entrenamiento-race-chip:hover:not(:disabled){border-color:var(--race-color,#f2c94c);transform:translateY(-2px);box-shadow:0 6px 18px -6px var(--race-color,rgba(242,201,76,.5));}
.entrenamiento-race-chip.is-selected{border-color:var(--race-color,#f2c94c);background:linear-gradient(180deg, color-mix(in srgb, var(--race-color,#f2c94c) 20%, transparent), transparent 70%);box-shadow:0 0 0 1px var(--race-color,#f2c94c) inset, 0 0 16px -2px var(--race-color,rgba(242,201,76,.6));}
.entrenamiento-race-chip-avatar{width:42px;height:42px;border-radius:50%;overflow:hidden;border:2px solid rgba(255,255,255,.18);background:rgba(0,0,0,.3);display:flex;align-items:center;justify-content:center;transition:border-color .18s ease;}
.entrenamiento-race-chip.is-selected .entrenamiento-race-chip-avatar{border-color:var(--race-color,#f2c94c);}
.entrenamiento-race-chip-avatar img{width:100%;height:100%;object-fit:cover;object-position:top center;}
.entrenamiento-race-chip-icon{font-size:1.3em;}
.entrenamiento-race-chip-label{font-weight:700;font-size:.78em;text-align:center;line-height:1.15;}
.entrenamiento-race-free{font-size:.72em;opacity:.55;}
.entrenamiento-race-chip.entrenamiento-race-full{opacity:.4;cursor:not-allowed;}
.entrenamiento-race-chip.entrenamiento-race-full:hover{transform:none;box-shadow:none;}
.entrenamiento-race-chip.entrenamiento-race-full .entrenamiento-race-free{color:#ef4444;opacity:.9;}

/* ── Cartas de dificultad (icono de raza + estrellas + descripcion, estilo CM-DRAFT) ────── */
/* Agrandadas (pedido explicito, "hacé más grande el cuadro para que se vea mejor el rango") --
   antes minmax(140px,1fr)/max-width:640px, ahora bastante mas anchas para que los dibujos de
   rango de 52px de arriba entren comodos sin amontonarse en Medio/Dificil (varios rangos por carta). */
.entrenamiento-difficulty{position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;max-width:820px;margin:0 auto 22px;}
.entrenamiento-diff-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:20px 14px 16px;border-radius:18px;overflow:hidden;border:2px solid rgba(255,255,255,.1);background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(0,0,0,.25));color:#fff;cursor:pointer;transition:border-color .2s ease, transform .2s ease, box-shadow .25s ease;}
.entrenamiento-diff-card::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% -10%, color-mix(in srgb, var(--diff-color,#f2c94c) 35%, transparent), transparent 65%);opacity:.55;pointer-events:none;transition:opacity .25s ease;}
.entrenamiento-diff-card:hover{border-color:var(--diff-color,#f2c94c);transform:translateY(-3px);box-shadow:0 10px 26px -10px var(--diff-color,rgba(242,201,76,.5));}
.entrenamiento-diff-card.is-selected{border-color:var(--diff-color,#f2c94c);transform:translateY(-4px) scale(1.03);box-shadow:0 0 0 1px var(--diff-color,#f2c94c) inset, 0 14px 34px -12px var(--diff-color,rgba(242,201,76,.65));animation:entrenamiento-diff-select-pulse 1.8s ease-in-out infinite;}
.entrenamiento-diff-card.is-selected::before{opacity:.9;}
@keyframes entrenamiento-diff-select-pulse{0%,100%{box-shadow:0 0 0 1px var(--diff-color,#f2c94c) inset, 0 14px 34px -12px var(--diff-color,rgba(242,201,76,.65));}50%{box-shadow:0 0 0 1px var(--diff-color,#f2c94c) inset, 0 14px 44px -8px var(--diff-color,rgba(242,201,76,.9));}}
.entrenamiento-diff-card-icon{position:relative;z-index:1;width:52px;height:52px;border-radius:50%;overflow:hidden;border:2px solid rgba(255,255,255,.2);background:rgba(0,0,0,.35);display:flex;align-items:center;justify-content:center;font-size:1.5em;transition:border-color .2s ease;}
.entrenamiento-diff-card.is-selected .entrenamiento-diff-card-icon{border-color:var(--diff-color,#f2c94c);}
.entrenamiento-diff-card-icon img{width:100%;height:100%;object-fit:cover;object-position:top center;}
.entrenamiento-diff-card-icon-fallback{opacity:.8;}
.entrenamiento-diff-card-label{position:relative;z-index:1;font-weight:800;font-size:.95em;letter-spacing:.02em;}
.entrenamiento-diff-card-stars{position:relative;z-index:1;display:flex;gap:2px;font-size:.85em;}
.entrenamiento-star{color:rgba(255,255,255,.18);transition:color .18s ease, text-shadow .18s ease, transform .18s ease;}
.entrenamiento-star.is-filled{color:rgba(255,255,255,.28);}
.entrenamiento-diff-card.is-selected .entrenamiento-star.is-filled{color:var(--diff-color,#f2c94c);text-shadow:0 0 8px var(--diff-color,rgba(242,201,76,.7));animation:entrenamiento-star-pop .4s ease backwards;}
.entrenamiento-diff-card.is-selected .entrenamiento-star.is-filled:nth-child(1){animation-delay:.02s;}
.entrenamiento-diff-card.is-selected .entrenamiento-star.is-filled:nth-child(2){animation-delay:.08s;}
.entrenamiento-diff-card.is-selected .entrenamiento-star.is-filled:nth-child(3){animation-delay:.14s;}
.entrenamiento-diff-card.is-selected .entrenamiento-star.is-filled:nth-child(4){animation-delay:.2s;}
@keyframes entrenamiento-star-pop{0%{transform:scale(0) rotate(-40deg);}70%{transform:scale(1.35) rotate(8deg);}100%{transform:scale(1) rotate(0);}}
.entrenamiento-diff-card-desc{position:relative;z-index:1;font-size:.68em;opacity:.65;text-align:center;line-height:1.35;min-height:2.6em;}
.entrenamiento-diff-card.is-selected .entrenamiento-diff-card-desc{opacity:.9;}
.entrenamiento-diff-free{position:relative;z-index:1;font-size:.64em;opacity:.55;padding:2px 8px;border-radius:8px;background:rgba(0,0,0,.25);}
.entrenamiento-diff-card-lock{position:absolute;top:8px;right:10px;z-index:2;font-size:1em;filter:drop-shadow(0 1px 3px rgba(0,0,0,.6));}
.entrenamiento-diff-locked{opacity:.55;border-style:dashed;}
.entrenamiento-diff-locked:hover{transform:none;box-shadow:none;border-color:rgba(255,255,255,.2);}
.entrenamiento-diff-locked.is-selected{animation:none;transform:none;box-shadow:none;border-color:rgba(255,255,255,.25);}
.entrenamiento-diff-full{opacity:.4;cursor:not-allowed;}
.entrenamiento-diff-full:hover{transform:none;box-shadow:none;}
.entrenamiento-diff-full .entrenamiento-diff-free{color:#ef4444;opacity:.9;}
/* Sparkle/shine "de un solo tiro" al elegir la carta -- ver entrenamiento.js flashDiffCard() */
.entrenamiento-diff-card-shine{position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(115deg, transparent 30%, rgba(255,255,255,.55) 48%, rgba(255,255,255,.55) 52%, transparent 70%);background-size:250% 250%;background-position:-40% -40%;opacity:0;}
.entrenamiento-diff-card.is-flash .entrenamiento-diff-card-shine{animation:entrenamiento-diff-shine .7s ease-out;}
@keyframes entrenamiento-diff-shine{0%{opacity:0;background-position:-60% -60%;}15%{opacity:1;}100%{opacity:0;background-position:60% 60%;}}

/* Badge "Madera → Bronce" que iba arriba de cada carta -- sacado (pedido explicito: "confunde al
   pedo, la gente piensa que tiene que clickear eso... ya están los rangos abajo para elegir").
   El keyframe se queda -- lo siguen usando .entrenamiento-diff-rank y .entrenamiento-lb-rank. */
@keyframes entrenamiento-rank-float{0%,100%{transform:translateY(0);}50%{transform:translateY(-3px);}}

/* Rangos (el DIBUJO real, no un globito de texto) de los bots que le pueden tocar en esta
   dificultad (post-rename Hierro/Bronze/Plata/Oro/Platino/Diamante/Master/Matrix, ver
   modules/entrenamiento.php entrenamientoDiffBotsHtml). Pedido explicito: "que se pinten tambien
   los rangos (los dibujos), sacá los globitos de abajo y pone directamente los rangos... más
   grandes". Arrancan en blanco y negro, se pintan del color real del rango al elegirlos (solo el
   guerrero tiene mas de una variante por tier -- Mago/Elfa/MG quedan como uno solo, informativo). */
.entrenamiento-diff-card-bots{position:relative;z-index:1;display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:10px;margin:4px 0 6px;}
.entrenamiento-diff-rank{display:flex;flex-direction:column;align-items:center;gap:3px;}
.entrenamiento-diff-rank img{width:52px;height:52px;object-fit:contain;filter:grayscale(1) brightness(.75) drop-shadow(0 0 4px rgba(255,255,255,.15));animation:entrenamiento-rank-float 2.6s ease-in-out infinite;transition:filter .3s ease, transform .2s ease;}
.entrenamiento-diff-rank:nth-child(2) img{animation-delay:.3s;}
.entrenamiento-diff-rank:nth-child(3) img{animation-delay:.6s;}
.entrenamiento-diff-rank:nth-child(4) img{animation-delay:.9s;}
.entrenamiento-diff-rank-name{font-size:.6em;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:rgba(255,255,255,.5);transition:color .25s ease, text-shadow .25s ease;}
/* Pedido explicito: "que los rangos estén en blanco y negro hasta que los elegís" -- se quedan
   en gris SIEMPRE, incluso con la carta ya seleccionada, hasta que se elige un rango puntual
   (.is-chosen mas abajo es lo unico que los saca del gris). */

.entrenamiento-diff-rank.is-pickable{cursor:pointer;}
.entrenamiento-diff-rank.is-pickable:hover img{filter:grayscale(.35) brightness(1) drop-shadow(0 0 6px var(--rank-chip-color,rgba(242,201,76,.5)));transform:translateY(-2px) scale(1.06);}
.entrenamiento-diff-rank.is-pickable:hover .entrenamiento-diff-rank-name{color:rgba(255,255,255,.8);}
.entrenamiento-diff-rank.is-pickable.is-chosen img{filter:none saturate(1.3) drop-shadow(0 0 12px var(--rank-chip-color,#f2c94c));transform:translateY(-2px) scale(1.12);animation-duration:1.3s;}
.entrenamiento-diff-rank.is-pickable.is-chosen .entrenamiento-diff-rank-name{color:var(--rank-chip-color,#f2c94c);text-shadow:0 0 8px color-mix(in srgb, var(--rank-chip-color,#f2c94c) 65%, transparent);}

/* MATRIX -- no existe un rango real "mas alla de Maestro" en el sitio, asi que se arma uno propio
   (pedido explicito: "creale un rango vos en funcion del Maestro, hacelo de color negro lujoso")
   reusando el mismo dibujo de Maestro pero tratado a blanco y negro + dorado en vez de violeta,
   sobre un fondo circular negro con anillo dorado -- efecto "ónix con reborde de oro". */
.entrenamiento-diff-rank.is-matrix{position:relative;}
.entrenamiento-diff-rank.is-matrix img{position:relative;z-index:1;filter:grayscale(1) brightness(.55) contrast(1.15) drop-shadow(0 0 4px rgba(0,0,0,.8));}
.entrenamiento-diff-rank.is-matrix::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:60px;height:60px;border-radius:50%;background:radial-gradient(circle at 35% 30%, #2a2a2a, #050505 70%);border:1px solid rgba(212,175,55,.5);box-shadow:0 0 10px -2px rgba(212,175,55,.35), inset 0 0 8px rgba(0,0,0,.8);}
.entrenamiento-diff-rank.is-matrix .entrenamiento-diff-rank-name{background:linear-gradient(90deg,#d4af37,#f4e5a1,#d4af37);-webkit-background-clip:text;background-clip:text;color:transparent;}
.entrenamiento-diff-rank.is-matrix.is-pickable:hover img{filter:grayscale(1) brightness(.75) contrast(1.15) drop-shadow(0 0 8px rgba(212,175,55,.6));}
.entrenamiento-diff-rank.is-matrix.is-pickable:hover::before{border-color:rgba(212,175,55,.85);box-shadow:0 0 16px -2px rgba(212,175,55,.6), inset 0 0 8px rgba(0,0,0,.8);}
.entrenamiento-diff-rank.is-matrix.is-pickable.is-chosen img{filter:grayscale(1) brightness(1) contrast(1.2) drop-shadow(0 0 12px #d4af37);}
.entrenamiento-diff-rank.is-matrix.is-pickable.is-chosen::before{border-color:#d4af37;box-shadow:0 0 22px -2px rgba(212,175,55,.85), inset 0 0 10px rgba(0,0,0,.8);}
.entrenamiento-diff-rank.is-matrix.is-pickable.is-chosen .entrenamiento-diff-rank-name{text-shadow:0 0 10px rgba(212,175,55,.7);}

/* Pintado del recuadro ENTERO segun el rango elegido -- pedido explicito: "que en función al
   rango que elijas se pinte todo el recuadro también, y en los rangos a partir de oro en
   adelante aparezcan efectos en el recuadro". --picked-rank-color lo setea el JS (paintRankOnCard)
   con el mismo color del rango elegido. */
.entrenamiento-diff-card.has-rank-chosen{border-color:var(--picked-rank-color,var(--diff-color,#f2c94c));box-shadow:0 0 0 1px var(--picked-rank-color,var(--diff-color,#f2c94c)) inset, 0 16px 36px -12px var(--picked-rank-color,rgba(242,201,76,.7));}
.entrenamiento-diff-card.has-rank-chosen::before{opacity:.95;background:radial-gradient(circle at 50% -10%, color-mix(in srgb, var(--picked-rank-color,#f2c94c) 45%, transparent), transparent 70%);}
/* Oro en adelante (power>=4): shine barrido continuo sobre la carta. */
.entrenamiento-diff-card.has-rank-effect{position:relative;animation:entrenamiento-diff-select-pulse 1.6s ease-in-out infinite;}
.entrenamiento-diff-card.has-rank-effect::after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(115deg, transparent 35%, color-mix(in srgb, var(--picked-rank-color,#f2c94c) 55%, transparent) 48%, color-mix(in srgb, var(--picked-rank-color,#f2c94c) 55%, transparent) 52%, transparent 65%);background-size:250% 250%;animation:entrenamiento-diff-shine 2.4s ease-in-out infinite;}
/* Diamante en adelante (power>=6): mas intenso, ademas particulas chispeando en las esquinas. */
.entrenamiento-diff-card.has-rank-effect-epic{animation:entrenamiento-diff-select-pulse 1.1s ease-in-out infinite;}
.entrenamiento-diff-card.has-rank-effect-epic::after{animation-duration:1.5s;}
.entrenamiento-diff-card.has-rank-effect-epic .entrenamiento-diff-card-icon{box-shadow:0 0 14px -2px var(--picked-rank-color,#f2c94c);}
.entrenamiento-diff-card.has-rank-effect-epic{background-image:radial-gradient(circle, var(--picked-rank-color,#f2c94c) 1px, transparent 1.5px);background-size:22px 22px;background-position:0 0, 11px 11px;}

/* Reseña del rango (bullets cortos) -- pedido explicito, panel debajo de las cartas que se
   actualiza al elegir/pasar el mouse por un rango (ver showRankReview en entrenamiento.js). */
.entrenamiento-rank-review{max-width:520px;margin:0 auto 20px;padding:14px 18px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(0,0,0,.2));text-align:left;animation:entrenamiento-rank-review-in .25s ease;}
@keyframes entrenamiento-rank-review-in{0%{opacity:0;transform:translateY(-4px);}100%{opacity:1;transform:translateY(0);}}
.entrenamiento-rank-review-header{display:flex;align-items:center;gap:8px;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.1);}
.entrenamiento-rank-review-icon{font-size:1.3em;}
.entrenamiento-rank-review-name{font-size:.95em;font-weight:800;letter-spacing:.04em;color:#f2c94c;}
.entrenamiento-rank-review-lines{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:5px;}
.entrenamiento-rank-review-lines li{position:relative;padding-left:16px;font-size:.8em;opacity:.85;line-height:1.4;}
.entrenamiento-rank-review-lines li::before{content:'▫️';position:absolute;left:0;top:0;font-size:.85em;}

/* ── Progreso hacia Hybrid -- solo se renderiza de Maestro para arriba (modules/entrenamiento.php).
      Paleta arcoiris a proposito: es la misma marca que el cliente le pone al nick en el juego. ── */
.entrenamiento-hybrid{position:relative;overflow:hidden;max-width:640px;margin:0 auto 16px;padding:18px 20px;border-radius:16px;border:1px solid rgba(255,215,0,.28);background:linear-gradient(160deg, rgba(124,58,237,.14), rgba(14,12,20,.72) 55%);text-align:left;box-shadow:0 16px 40px -22px rgba(0,0,0,.85), 0 0 0 1px rgba(255,255,255,.03) inset;}
.entrenamiento-hybrid::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,#ff4d4d,#ffb020,#ffd700,#22c55e,#3fb6ff,#a855f7,#ff4d4d);background-size:300% 100%;animation:entrenamiento-hybrid-sweep 6s linear infinite;}
@keyframes entrenamiento-hybrid-sweep{to{background-position:300% 0;}}
.entrenamiento-hybrid.is-unlocked{border-color:rgba(255,215,0,.55);}
.entrenamiento-hybrid-glow{position:absolute;top:-70%;left:50%;width:260px;height:260px;transform:translateX(-50%);background:radial-gradient(circle, rgba(168,85,247,.3), transparent 70%);pointer-events:none;animation:entrenamiento-glow-pulse 6s ease-in-out infinite;}

.entrenamiento-hybrid-head{position:relative;display:flex;align-items:flex-start;gap:12px;margin-bottom:16px;}
.entrenamiento-hybrid-icon{flex-shrink:0;width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.4em;background:linear-gradient(145deg,#a855f7,#ffd700);box-shadow:0 4px 14px -4px rgba(255,215,0,.6);}
.entrenamiento-hybrid-title{margin:0;font-weight:800;font-size:1.05em;letter-spacing:.01em;}
.entrenamiento-hybrid-subtitle{margin:3px 0 0;font-size:.76em;opacity:.7;line-height:1.45;}

.entrenamiento-hybrid-reqs{position:relative;display:flex;flex-direction:column;gap:10px;}
.entrenamiento-hybrid-req{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:12px;background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.06);}
.entrenamiento-hybrid-req.is-done{border-color:rgba(34,197,94,.35);background:rgba(34,197,94,.08);}
.entrenamiento-hybrid-req-check{flex-shrink:0;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8em;font-weight:800;background:rgba(255,255,255,.08);color:rgba(255,255,255,.45);}
.entrenamiento-hybrid-req.is-done .entrenamiento-hybrid-req-check{background:#22c55e;color:#04140a;}
.entrenamiento-hybrid-req-body{flex:1;min-width:0;}
.entrenamiento-hybrid-req-title{font-weight:700;font-size:.9em;}
.entrenamiento-hybrid-req-detail{margin-top:3px;font-size:.76em;opacity:.75;line-height:1.45;}
.entrenamiento-hybrid-req-detail code{padding:1px 5px;border-radius:5px;background:rgba(255,255,255,.08);font-size:.95em;}

.entrenamiento-hybrid-bar{position:relative;margin-top:10px;height:20px;border-radius:10px;overflow:hidden;background:rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.08);}
.entrenamiento-hybrid-bar-fill{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#a855f7,#ffd700);transition:width .4s ease;}
.entrenamiento-hybrid-bar-text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.68em;font-weight:800;letter-spacing:.04em;text-shadow:0 1px 3px rgba(0,0,0,.9);}

.entrenamiento-hybrid-bots{position:relative;margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.08);}
.entrenamiento-hybrid-bots-label{font-size:.62em;text-transform:uppercase;letter-spacing:.06em;opacity:.55;margin-bottom:8px;}
.entrenamiento-hybrid-bots-list{display:flex;flex-wrap:wrap;gap:8px;}
/* Los bots todavia sin victorias se ven apagados -- de un vistazo se entiende contra quien falta. */
.entrenamiento-hybrid-bot{display:inline-flex;align-items:center;gap:6px;padding:5px 10px 5px 6px;border-radius:20px;background:rgba(0,0,0,.3);border:1px solid rgba(255,255,255,.07);opacity:.5;transition:opacity .2s ease, border-color .2s ease;}
.entrenamiento-hybrid-bot.has-wins{opacity:1;border-color:var(--rank-chip-color,rgba(255,255,255,.2));}
.entrenamiento-hybrid-bot img{width:22px;height:22px;flex-shrink:0;object-fit:contain;}
.entrenamiento-hybrid-bot-name{font-size:.68em;font-weight:800;letter-spacing:.04em;}
.entrenamiento-hybrid-bot-wins{min-width:20px;padding:1px 6px;border-radius:10px;font-size:.68em;font-weight:800;text-align:center;background:rgba(255,255,255,.08);}
.entrenamiento-hybrid-bot.has-wins .entrenamiento-hybrid-bot-wins{background:var(--rank-chip-color,#f2c94c);color:#0f0c09;}

.entrenamiento-hybrid-note{position:relative;margin:10px 0 0;font-size:.72em;opacity:.55;line-height:1.45;}
.entrenamiento-hybrid-warn{position:relative;margin:12px 0 0;padding:10px 12px;border-radius:10px;font-size:.76em;line-height:1.45;background:rgba(242,201,76,.09);border:1px solid rgba(242,201,76,.25);}
.entrenamiento-hybrid-warn a{color:#f2c94c;font-weight:700;text-decoration:underline;}

@media (max-width:560px){
	.entrenamiento-hybrid{padding:16px 14px;}
	.entrenamiento-hybrid-bots-list{gap:6px;}
}

/* ── "Duelos en curso" -- estilo HUD del coliseo (barra dorado->rojo + pips + espadas) ──────── */
.entrenamiento-active-duels{max-width:640px;margin:0 auto 16px;border-radius:14px;border:1px solid rgba(242,201,76,.25);background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(0,0,0,.15));overflow:hidden;box-shadow:0 12px 30px -18px rgba(0,0,0,.7);}
.entrenamiento-active-duels-header{padding:10px 16px;font-weight:800;font-size:.82em;text-transform:uppercase;letter-spacing:.06em;background:rgba(242,201,76,.08);border-bottom:1px solid rgba(242,201,76,.15);color:#f2c94c;}
.entrenamiento-active-duels-list{max-height:280px;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:10px;}

.entrenamiento-duel-card{position:relative;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px;padding:10px 12px 8px;border-radius:12px;border:1px solid rgba(120,90,40,.4);background:linear-gradient(180deg, #2a2118, #171310 60%, #0f0c09);box-shadow:0 4px 14px -6px rgba(0,0,0,.8), 0 0 0 1px rgba(255,255,255,.03) inset;}
.entrenamiento-duel-card-diff{position:absolute;top:-8px;left:50%;transform:translateX(-50%);font-size:.6em;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#0f0c09;background:linear-gradient(90deg,#f2c94c,#fbbf24);padding:2px 10px;border-radius:20px;box-shadow:0 2px 6px rgba(0,0,0,.5);white-space:nowrap;}
.entrenamiento-duel-side{display:flex;align-items:center;gap:8px;min-width:0;}
.entrenamiento-duel-side.is-bot{flex-direction:row-reverse;text-align:right;}
.entrenamiento-duel-avatar{width:30px;height:30px;flex-shrink:0;border-radius:50%;overflow:hidden;border:2px solid var(--race-color,#f2c94c);box-shadow:0 0 8px -1px var(--race-color,rgba(242,201,76,.6));background:rgba(0,0,0,.4);display:flex;align-items:center;justify-content:center;}
.entrenamiento-duel-avatar img{width:100%;height:100%;object-fit:cover;object-position:top center;}
.entrenamiento-duel-avatar-fallback{font-size:.9em;}
.entrenamiento-duel-side-main{flex:1;min-width:0;}
.entrenamiento-duel-name{display:block;font-size:.72em;font-weight:700;color:#f1e6c8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:3px;}
.entrenamiento-duel-side.is-bot .entrenamiento-duel-name{color:#fca5a5;}
.entrenamiento-duel-bar{position:relative;height:9px;border-radius:5px;background:#000;border:1px solid rgba(0,0,0,.6);box-shadow:0 0 0 1px rgba(255,255,255,.06) inset;overflow:hidden;}
.entrenamiento-duel-bar-fill{position:absolute;inset:0;width:0%;background:linear-gradient(90deg,#facc15,#f97316,#dc2626);box-shadow:0 0 6px rgba(250,204,21,.5);transition:width .6s cubic-bezier(.22,.9,.35,1);}
.entrenamiento-duel-side.is-bot .entrenamiento-duel-bar-fill{background:linear-gradient(270deg,#facc15,#f97316,#dc2626);}
.entrenamiento-duel-pips{display:flex;gap:2px;margin-top:3px;}
.entrenamiento-duel-side.is-bot .entrenamiento-duel-pips{justify-content:flex-end;}
.entrenamiento-duel-pip{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.12);border:1px solid rgba(0,0,0,.5);}
.entrenamiento-duel-pip.is-filled{background:radial-gradient(circle at 35% 30%, #fef08a, #d97706 70%);box-shadow:0 0 4px rgba(250,204,21,.7);}
.entrenamiento-duel-vs{font-size:1.1em;color:#f2c94c;text-shadow:0 0 8px rgba(242,201,76,.6);padding:0 2px;}

/* ── Ranking de Entrenamiento (jugadores + "MMR" de bots) ────────────────────────────────── */
.entrenamiento-leaderboard{max-width:680px;margin:0 auto 16px;border-radius:14px;border:1px solid rgba(242,201,76,.25);background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(0,0,0,.18));overflow:hidden;box-shadow:0 12px 30px -18px rgba(0,0,0,.7);}
.entrenamiento-leaderboard-tabs{display:flex;}
.entrenamiento-leaderboard-tab{flex:1;padding:11px 10px;border:none;background:rgba(255,255,255,.02);color:#fff;opacity:.55;font-weight:700;font-size:.82em;cursor:pointer;border-bottom:2px solid transparent;transition:opacity .15s ease, background .15s ease, border-color .15s ease;}
.entrenamiento-leaderboard-tab:hover{opacity:.8;background:rgba(255,255,255,.04);}
.entrenamiento-leaderboard-tab.is-selected{opacity:1;background:rgba(242,201,76,.1);border-color:#f2c94c;color:#f2c94c;}
.entrenamiento-leaderboard-panel{padding:10px;}
.entrenamiento-leaderboard-bots-hint{margin:0 4px 8px;}
.entrenamiento-leaderboard-list{display:flex;flex-direction:column;gap:6px;max-height:340px;overflow-y:auto;}

.entrenamiento-lb-row{position:relative;display:grid;grid-template-columns:34px 34px 1fr auto;align-items:center;gap:10px;padding:8px 12px;border-radius:10px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);transition:transform .15s ease, background .15s ease, box-shadow .2s ease;}
.entrenamiento-lb-row:hover{transform:translateX(2px);background:rgba(255,255,255,.06);box-shadow:0 4px 14px -8px var(--race-color,rgba(242,201,76,.5));}
.entrenamiento-lb-pos{font-size:1em;font-weight:800;text-align:center;opacity:.7;font-variant-numeric:tabular-nums;}
.entrenamiento-lb-rank{width:32px;height:32px;border-radius:50%;overflow:hidden;background:rgba(0,0,0,.3);display:flex;align-items:center;justify-content:center;}
.entrenamiento-lb-rank img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 5px var(--rank-color,#f2c94c));animation:entrenamiento-rank-float 3s ease-in-out infinite;}
.entrenamiento-lb-bot-avatar{border-radius:50%;overflow:hidden;border:2px solid var(--race-color,#f2c94c);box-shadow:0 0 6px -1px var(--race-color,rgba(242,201,76,.6));}
.entrenamiento-lb-bot-avatar img{width:100%;height:100%;object-fit:cover;object-position:top center;filter:none;animation:none;}
.entrenamiento-lb-main{min-width:0;display:flex;flex-direction:column;gap:1px;}
.entrenamiento-lb-name{font-size:.86em;font-weight:700;color:#f1e6c8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.entrenamiento-lb-sub{font-size:.66em;opacity:.6;display:flex;align-items:center;gap:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.entrenamiento-lb-sub img,.entrenamiento-lb-sub .entrenamiento-lb-bot-fallback{width:15px;height:15px;border-radius:50%;object-fit:cover;object-position:top center;display:inline-flex;align-items:center;justify-content:center;font-size:.85em;flex-shrink:0;}
.entrenamiento-lb-sub em{font-style:normal;opacity:.8;}
.entrenamiento-lb-stats{display:flex;flex-direction:column;align-items:flex-end;gap:2px;}
.entrenamiento-lb-wl{font-size:.72em;white-space:nowrap;}
.entrenamiento-lb-wl .is-win{color:#4ade80;}
.entrenamiento-lb-wl .is-loss{color:#f87171;margin-left:4px;}
.entrenamiento-lb-winrate{font-size:.78em;font-weight:800;color:#f2c94c;}
.entrenamiento-lb-rating{font-size:.72em;font-weight:800;color:#c084fc;}

/* Top 3 -- oro/plata/bronce, con resplandor y un poco mas de presencia */
.entrenamiento-lb-row.is-top-1{border-color:rgba(250,204,21,.5);background:linear-gradient(90deg, rgba(250,204,21,.14), rgba(255,255,255,.03) 60%);box-shadow:0 0 18px -6px rgba(250,204,21,.4);animation:entrenamiento-lb-top-pulse 2.6s ease-in-out infinite;}
.entrenamiento-lb-row.is-top-2{border-color:rgba(203,213,225,.4);background:linear-gradient(90deg, rgba(203,213,225,.1), rgba(255,255,255,.03) 60%);}
.entrenamiento-lb-row.is-top-3{border-color:rgba(217,119,6,.4);background:linear-gradient(90deg, rgba(217,119,6,.12), rgba(255,255,255,.03) 60%);}
.entrenamiento-lb-row.is-top-1 .entrenamiento-lb-pos{font-size:1.2em;}
@keyframes entrenamiento-lb-top-pulse{0%,100%{box-shadow:0 0 14px -6px rgba(250,204,21,.35);}50%{box-shadow:0 0 22px -4px rgba(250,204,21,.6);}}

/* Historial de resultados individuales (tab "Resultados recientes", ver renderResultsList en
   entrenamiento.js / modules/rankings/entrenamiento.php) -- una fila = un duelo terminado, a
   diferencia de .entrenamiento-lb-row (que es un renglon AGREGADO de ranking). */
.entrenamiento-result-row{position:relative;display:grid;grid-template-columns:24px 1fr auto auto;align-items:center;gap:10px;padding:8px 12px;border-radius:10px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-left:3px solid var(--race-color,#f2c94c);transition:background .15s ease;}
.entrenamiento-result-row:hover{background:rgba(255,255,255,.06);}
.entrenamiento-result-row.is-win{border-left-color:#4ade80;}
.entrenamiento-result-row.is-loss{border-left-color:#f87171;}
.entrenamiento-result-outcome{font-size:1.05em;text-align:center;}
.entrenamiento-result-main{min-width:0;display:flex;flex-direction:column;gap:1px;}
.entrenamiento-result-main strong{font-size:.86em;font-weight:700;color:#f1e6c8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.entrenamiento-result-vs{font-size:.66em;opacity:.65;display:flex;align-items:center;gap:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.entrenamiento-result-vs img,.entrenamiento-result-vs .entrenamiento-lb-bot-fallback{width:15px;height:15px;border-radius:50%;object-fit:cover;object-position:top center;display:inline-flex;align-items:center;justify-content:center;font-size:.85em;flex-shrink:0;}
.entrenamiento-result-vs em{font-style:normal;opacity:.8;}
.entrenamiento-result-score{font-size:.86em;font-weight:800;color:#f2c94c;white-space:nowrap;font-variant-numeric:tabular-nums;}
.entrenamiento-result-time{font-size:.64em;opacity:.5;white-space:nowrap;}
@media (max-width:480px){.entrenamiento-result-row{grid-template-columns:20px 1fr auto;}.entrenamiento-result-time{display:none;}}

.entrenamiento-cta{position:relative;display:inline-flex;align-items:center;gap:10px;padding:14px 30px;border-radius:12px;border:1px solid #f2c94c;background:linear-gradient(135deg, rgba(242,201,76,.22), rgba(239,68,68,.18));color:#fff;font-weight:700;font-size:1.05em;letter-spacing:.02em;cursor:pointer;box-shadow:0 0 0 rgba(242,201,76,.5);transition:transform .15s ease, box-shadow .3s ease;}
.entrenamiento-cta:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 24px rgba(242,201,76,.35);}
.entrenamiento-cta:active:not(:disabled){transform:translateY(0);}
.entrenamiento-cta:disabled{opacity:.45;cursor:default;}
.entrenamiento-cta-icon{font-size:1.2em;animation:entrenamiento-cta-swing 2.2s ease-in-out infinite;}
.entrenamiento-cta-secondary{margin-top:14px;border-color:#7c7cf2;background:linear-gradient(135deg, rgba(124,124,242,.20), rgba(76,201,196,.16));font-size:.95em;padding:11px 24px;}
.entrenamiento-cta-secondary:hover:not(:disabled){box-shadow:0 6px 24px rgba(124,124,242,.3);}
@keyframes entrenamiento-cta-swing{0%,100%{transform:rotate(0deg);}25%{transform:rotate(-18deg);}75%{transform:rotate(18deg);}}
.entrenamiento-hint{position:relative;margin-top:12px;font-size:.82em;opacity:.6;}

.entrenamiento-admin-force{margin-top:16px;padding:14px 16px;border-radius:12px;border:1px solid rgba(124,124,242,.3);background:rgba(124,124,242,.06);text-align:left;max-width:520px;margin-left:auto;margin-right:auto;}
.entrenamiento-admin-force-title{font-weight:700;font-size:.9em;margin-bottom:10px;opacity:.9;}
.entrenamiento-admin-force-row{display:flex;flex-wrap:wrap;gap:8px;}
.entrenamiento-admin-force-input,.entrenamiento-admin-force-select{flex:1 1 160px;min-width:0;padding:8px 10px;border-radius:8px;border:1px solid rgba(255,255,255,.15);background:rgba(0,0,0,.25);color:inherit;font-size:.88em;}
.entrenamiento-admin-force-input:disabled,.entrenamiento-admin-force-select:disabled{opacity:.5;}
.entrenamiento-admin-force .entrenamiento-cta-secondary{margin-top:0;padding:8px 18px;font-size:.85em;flex:0 0 auto;}
.entrenamiento-admin-force .entrenamiento-hint{margin-top:8px;}

/* ── Tienda de tokens -- tarjeta "premium" con cofre/boleto, chips de stats y stepper ───────── */
.entrenamiento-token-shop{position:relative;overflow:hidden;margin-top:18px;padding:18px 20px;border-radius:16px;border:1px solid rgba(242,201,76,.4);background:linear-gradient(160deg, rgba(242,201,76,.1), rgba(20,16,10,.6) 60%);text-align:left;max-width:560px;margin-left:auto;margin-right:auto;box-shadow:0 16px 40px -22px rgba(0,0,0,.85), 0 0 0 1px rgba(255,255,255,.03) inset;}
.entrenamiento-token-shop-glow{position:absolute;top:-60%;left:50%;width:220px;height:220px;transform:translateX(-50%);background:radial-gradient(circle, rgba(242,201,76,.28), transparent 70%);pointer-events:none;animation:entrenamiento-glow-pulse 6s ease-in-out infinite;}
.entrenamiento-token-shop-header{position:relative;display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.entrenamiento-token-shop-icon{flex-shrink:0;width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.4em;background:linear-gradient(145deg,#f2c94c,#b8860b);box-shadow:0 4px 14px -4px rgba(242,201,76,.6);animation:entrenamiento-token-shop-icon-tilt 3.5s ease-in-out infinite;}
@keyframes entrenamiento-token-shop-icon-tilt{0%,100%{transform:rotate(-6deg);}50%{transform:rotate(6deg);}}
.entrenamiento-token-shop-title{font-weight:800;font-size:1.05em;letter-spacing:.01em;}
.entrenamiento-token-shop-subtitle{font-size:.74em;opacity:.65;margin-top:2px;}

.entrenamiento-token-shop-stats{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px;}
.entrenamiento-token-shop-stat{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 6px;border-radius:10px;background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.06);}
.entrenamiento-token-shop-stat-icon{font-size:1.1em;}
.entrenamiento-token-shop-stat-label{font-size:.62em;text-transform:uppercase;letter-spacing:.06em;opacity:.55;margin-top:2px;}
.entrenamiento-token-shop-stat-value{font-size:.92em;font-weight:800;color:#f2c94c;}

.entrenamiento-token-shop-buy{position:relative;display:flex;align-items:center;flex-wrap:wrap;gap:12px;padding-top:14px;border-top:1px solid rgba(255,255,255,.08);}
.entrenamiento-token-shop-stepper{display:flex;align-items:center;gap:0;border-radius:10px;overflow:hidden;border:1px solid rgba(255,255,255,.15);}
.entrenamiento-token-shop-step-btn{width:32px;height:34px;border:none;background:rgba(255,255,255,.06);color:#f2c94c;font-size:1.1em;font-weight:700;cursor:pointer;transition:background .15s ease;}
.entrenamiento-token-shop-step-btn:hover{background:rgba(242,201,76,.22);}
.entrenamiento-token-shop-step-btn:active{background:rgba(242,201,76,.35);}
.entrenamiento-token-shop-stepper input[type="number"]{width:52px;height:34px;text-align:center;border:none;border-left:1px solid rgba(255,255,255,.1);border-right:1px solid rgba(255,255,255,.1);background:rgba(0,0,0,.3);color:#fff;font-weight:700;font-size:.92em;-moz-appearance:textfield;}
.entrenamiento-token-shop-stepper input[type="number"]::-webkit-outer-spin-button,.entrenamiento-token-shop-stepper input[type="number"]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.entrenamiento-token-shop-total{display:flex;flex-direction:column;font-size:.7em;opacity:.75;line-height:1.3;}
.entrenamiento-token-shop-total strong{font-size:1.25em;color:#f2c94c;text-shadow:0 0 10px rgba(242,201,76,.4);}
.entrenamiento-token-shop-buy-btn{margin-left:auto;display:inline-flex;align-items:center;gap:8px;padding:11px 22px;border-radius:10px;border:1px solid #f2c94c;background:linear-gradient(135deg,#f2c94c,#d97706);color:#1a1206;font-weight:800;font-size:.92em;cursor:pointer;box-shadow:0 8px 20px -8px rgba(242,201,76,.6);transition:transform .15s ease, box-shadow .2s ease;}
.entrenamiento-token-shop-buy-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 12px 28px -8px rgba(242,201,76,.75);}
.entrenamiento-token-shop-buy-btn:active:not(:disabled){transform:translateY(0);}
.entrenamiento-token-shop-buy-btn:disabled{opacity:.5;cursor:default;}
.entrenamiento-token-shop-buy-icon{font-size:1.1em;}
.entrenamiento-token-shop .entrenamiento-hint{position:relative;margin-top:10px;}

.entrenamiento-admin-race-toggles{display:flex;flex-direction:column;gap:6px;margin-top:8px;}
.entrenamiento-admin-race-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.entrenamiento-admin-race-label{flex:0 0 90px;font-size:.85em;opacity:.85;}
.entrenamiento-admin-race-row .entrenamiento-cta-secondary{margin-top:0;padding:6px 14px;font-size:.78em;flex:0 0 auto;}
.entrenamiento-admin-bot-list{margin-top:10px;max-height:220px;overflow-y:auto;border-radius:8px;border:1px solid rgba(255,255,255,.1);background:rgba(0,0,0,.15);}
.entrenamiento-admin-bot-row{display:flex;align-items:center;gap:10px;padding:6px 10px;font-size:.82em;border-bottom:1px solid rgba(255,255,255,.06);}
.entrenamiento-admin-bot-row:last-child{border-bottom:none;}
.entrenamiento-admin-bot-row.is-disabled{opacity:.5;}
.entrenamiento-admin-bot-name{flex:1 1 auto;text-align:left;}
.entrenamiento-admin-bot-tag{opacity:.6;font-size:.9em;}

.entrenamiento-admin-damage-toggle{display:flex;align-items:center;gap:6px;font-size:.85em;flex:0 0 auto;}
.entrenamiento-admin-damage-field{display:flex;flex-direction:column;gap:3px;font-size:.78em;opacity:.85;flex:0 0 auto;}
.entrenamiento-admin-damage-field .entrenamiento-admin-force-input{width:80px;flex:0 0 auto;}

.entrenamiento-duel-panel{margin-top:16px;padding:16px 20px;border-radius:14px;border:1px solid rgba(242,201,76,.4);background:linear-gradient(180deg, rgba(242,201,76,.1), rgba(242,201,76,.03));animation:entrenamiento-panel-in .35s ease-out;}
@keyframes entrenamiento-panel-in{from{opacity:0;transform:translateY(-8px);}to{opacity:1;transform:translateY(0);}}
.entrenamiento-duel-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;}
.entrenamiento-duel-header strong{color:#f2c94c;font-size:1.05em;}
.entrenamiento-duel-time{font-variant-numeric:tabular-nums;font-weight:600;opacity:.85;background:rgba(0,0,0,.35);padding:3px 10px;border-radius:20px;font-size:.85em;}

.entrenamiento-bar-row{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.entrenamiento-bar-row:last-child{margin-bottom:0;}
.entrenamiento-bar-name{width:110px;flex-shrink:0;font-size:.85em;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.entrenamiento-bar{position:relative;flex:1;height:22px;border-radius:11px;background:rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.1);overflow:hidden;}
.entrenamiento-bar-fill{position:absolute;inset:0;width:0%;transition:width .6s cubic-bezier(.22,.9,.35,1);}
.entrenamiento-bar-player .entrenamiento-bar-fill{background:linear-gradient(90deg,#1d4ed8,#3b82f6,#60a5fa);box-shadow:0 0 12px rgba(59,130,246,.6) inset;}
.entrenamiento-bar-bot .entrenamiento-bar-fill{background:linear-gradient(90deg,#991b1b,#ef4444,#f87171);box-shadow:0 0 12px rgba(239,68,68,.6) inset;}
.entrenamiento-bar-score{position:relative;z-index:1;display:block;text-align:center;line-height:22px;font-size:.78em;font-weight:700;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.9);}

/* Popup de cuenta regresiva */
.entrenamiento-overlay{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:rgba(5,6,10,.78);backdrop-filter:blur(4px);animation:entrenamiento-fade-in .25s ease-out;}
.entrenamiento-overlay[hidden]{display:none;} /* [hidden] del navegador pierde contra .entrenamiento-overlay{display:flex} si no se re-afirma aca */
@keyframes entrenamiento-fade-in{from{opacity:0;}to{opacity:1;}}
.entrenamiento-modal{position:relative;width:min(90vw,340px);padding:30px 26px 28px;border-radius:20px;text-align:center;background:radial-gradient(circle at 50% 0%, rgba(242,201,76,.18), transparent 65%), linear-gradient(180deg,#191c26,#121319);border:1px solid rgba(242,201,76,.35);box-shadow:0 24px 70px rgba(0,0,0,.65), 0 0 0 1px rgba(255,255,255,.03) inset;animation:entrenamiento-modal-in .35s cubic-bezier(.2,.9,.3,1.2);}
@keyframes entrenamiento-modal-in{from{opacity:0;transform:scale(.85) translateY(10px);}to{opacity:1;transform:scale(1) translateY(0);}}
.entrenamiento-modal-ring{margin:0 auto;width:96px;height:96px;border-radius:50%;border:3px solid rgba(242,201,76,.55);background:radial-gradient(circle, rgba(242,201,76,.14), transparent 70%);animation:entrenamiento-ring-pulse 2s ease-in-out infinite;display:flex;align-items:center;justify-content:center;}
@keyframes entrenamiento-ring-pulse{0%,100%{box-shadow:0 0 10px rgba(242,201,76,.3);transform:scale(1);}50%{box-shadow:0 0 26px rgba(242,201,76,.6);transform:scale(1.04);}}
.entrenamiento-modal-count{font-size:2.6em;font-weight:800;line-height:1;color:#f2c94c;text-shadow:0 0 20px rgba(242,201,76,.55);animation:entrenamiento-count-pop .4s ease-out;}
@keyframes entrenamiento-count-pop{0%{transform:scale(1.35);opacity:0;}60%{transform:scale(.94);opacity:1;}100%{transform:scale(1);}}
.entrenamiento-modal-title{margin-top:16px;font-weight:700;letter-spacing:.02em;opacity:.9;font-size:.95em;}
.entrenamiento-modal-tip{margin-top:16px;min-height:2.8em;display:flex;align-items:center;justify-content:center;font-size:.85em;line-height:1.5;opacity:.75;padding:0 8px;animation:entrenamiento-tip-in .4s ease-out;border-top:1px solid rgba(255,255,255,.08);padding-top:14px;}
@keyframes entrenamiento-tip-in{from{opacity:0;transform:translateY(4px);}to{opacity:.75;transform:translateY(0);}}
