:root{
--bg:#050a12;--panel:#0b1421;--panel2:#101d2d;--panel3:#142438;--line:#253d55;--text:#eef8ff;--muted:#a7bed0;
--cyan:#37d8ff;--blue:#4e8dff;--green:#40e38c;--yellow:#ffd765;--orange:#ff9a56;--red:#ff5e6f;--pink:#ff53b2;--purple:#8e6cff;
--score:"0";--gems:"0";--lives:"5";--progress:"0%";--progress-width:0%;--rank:"RECLUTA";
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 18% -10%,#173e62 0,transparent 28%),radial-gradient(circle at 90% 8%,#2a164d 0,transparent 23%),linear-gradient(180deg,#050a12,#07101b 45%,#04080e);color:var(--text);font-family:Arial,Helvetica,sans-serif;line-height:1.55}
a{color:var(--cyan)}h1,h2,h3,h4,p{margin-top:0}
.control-opcion{position:absolute;width:1px;height:1px;margin:0;opacity:0}
.control-opcion:focus-visible+label{outline:3px solid var(--yellow);outline-offset:4px;box-shadow:0 0 0 6px rgba(255,215,101,.12)}
a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}
.game-shell{display:none}body:has(#partida-activa:checked) .game-shell{display:block}
.registro-overlay{min-height:100vh;padding:42px 5vw 54px;background:linear-gradient(160deg,rgba(5,10,18,.96),rgba(8,23,38,.95)),radial-gradient(circle at 50% 0,rgba(55,216,255,.18),transparent 34%);border-bottom:1px solid #29465e;position:relative;z-index:30}.registro-portada{max-width:1180px;margin:0 auto;text-align:center}.kicker{color:var(--cyan);font-size:.78rem;font-weight:900;letter-spacing:.14em}.registro-portada h1{font-size:clamp(2.6rem,7vw,5.4rem);line-height:.95;margin:12px 0;text-shadow:0 0 38px rgba(55,216,255,.18)}.registro-portada h2{font-size:clamp(1.2rem,3vw,2rem);color:#ccecff}.intro-juego{max-width:850px;margin:18px auto 28px;color:#d6e9f7;font-size:1.08rem}.como-jugar{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;max-width:1180px;margin:28px auto}.como-jugar article{padding:18px;border:1px solid #294b67;border-radius:18px;background:linear-gradient(145deg,#0e1d2e,#0a1522);text-align:left}.paso-numero{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--cyan),var(--purple));color:#02111d;font-weight:900}.reglas-claras{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;max-width:1000px;margin:24px auto;text-align:left}.reglas-claras p{margin:0;padding:12px 14px;border-left:4px solid var(--blue);background:rgba(78,141,255,.08);border-radius:8px}
.perfil-persistente{max-width:1180px;margin:26px auto 0;padding:18px;border:1px solid #315472;border-radius:22px;background:rgba(8,22,36,.92);box-shadow:0 20px 70px rgba(0,0,0,.28);display:grid;grid-template-columns:1.15fr 2fr auto;gap:18px;align-items:center}.perfil-identidad{display:flex;align-items:center;gap:14px}.avatar-preview{width:78px;height:78px;border-radius:22px;border:2px solid #3b6787;background:linear-gradient(145deg,#17314d,#091727);display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:inset 0 0 30px rgba(55,216,255,.06)}.avatar-preview-item{display:none;margin:0;font-size:2.7rem}.avatar-preview-default{display:block}body:has(input[name="avatar"]:checked) .avatar-preview-default{display:none}.nombre-jugador{flex:1}.nombre-jugador label{display:block;color:var(--muted);font-size:.72rem;letter-spacing:.12em;margin-bottom:5px}.nombre-jugador input{width:100%;min-width:160px;padding:11px 12px;border:1px solid #3c6280;border-radius:11px;background:#06121f;color:var(--text);font:inherit;font-weight:800;outline:none}.nombre-jugador input:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(55,216,255,.12)}.hud-compacto{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.hud-mini{min-height:76px;padding:9px 10px;border:1px solid #29465f;border-radius:13px;background:#081725;text-align:center}.hud-mini p{margin:0;color:var(--muted);font-size:.64rem;font-weight:900;letter-spacing:.06em}.hud-mini strong{display:block;margin:3px 0;font-size:1.55rem}.vidas-valor::after{content:var(--lives)}.puntaje-valor::after{content:var(--score)}.gemas-valor::after{content:var(--gems)}.editar-perfil{display:none;padding:9px 11px;border:1px solid #365d7d;border-radius:10px;color:#dff6ff;cursor:pointer;text-align:center;font-weight:800}.timer-track{height:4px;margin-top:5px;border-radius:99px;background:#152c40;overflow:hidden}.timer-fill{height:100%;width:0;background:linear-gradient(90deg,var(--green),var(--cyan),var(--purple))}
@property --elapsed{syntax:"<integer>";inherits:false;initial-value:0}.timer-number{--elapsed:0;counter-reset:elapsed var(--elapsed)}.timer-number::after{content:counter(elapsed) " s"}@keyframes chronometer{from{--elapsed:0}to{--elapsed:1500}}@keyframes timerbar{from{width:0}to{width:100%}}body:has(#partida-activa:checked):has(#nivel-1-activo:checked) .registro-overlay .timer-number{animation:chronometer 1500s steps(1500,end) forwards}body:has(#partida-activa:checked):has(#nivel-1-activo:checked) .registro-overlay .timer-fill{animation:timerbar 1500s linear forwards}
.registro-configuracion{max-width:1180px;margin:20px auto}.bloque-registro{margin:18px 0;padding:22px;border:1px solid #27455f;border-radius:20px;background:linear-gradient(145deg,rgba(16,31,48,.96),rgba(8,19,31,.96))}.bloque-registro>h2{margin-bottom:5px}.age-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}.age-grid label{padding:16px;border:1px solid #345b7a;border-radius:14px;background:#0a1b2b;text-align:center;cursor:pointer;font-size:1.04rem;transition:.18s}.age-grid label:hover{transform:translateY(-3px);border-color:var(--cyan)}body:has(#edad-child:checked) label[for="edad-child"],body:has(#edad-teen:checked) label[for="edad-teen"],body:has(#edad-young:checked) label[for="edad-young"],body:has(#edad-adult:checked) label[for="edad-adult"]{border-color:var(--green);background:rgba(64,227,140,.13);box-shadow:0 0 22px rgba(64,227,140,.08)}.avatar-help{color:var(--muted)}.avatar-group{display:none}.avatar-group-title{margin-bottom:16px}.avatar-group h4{margin:18px 0 8px;color:#d7efff}.avatar-grid{display:grid;grid-template-columns:repeat(10,1fr);gap:8px}.avatar-option{min-height:106px;padding:10px 6px;border:1px solid #2b4b66;border-radius:14px;background:#081725;text-align:center;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:.76rem;transition:.16s}.avatar-emoji{font-size:2.35rem}.avatar-option:hover{transform:translateY(-3px);border-color:var(--cyan);background:#0c2237}body:has(input[name="avatar"]:checked) .avatar-option{opacity:.62}body:has(#edad-child:checked) .avatars-child{display:block}
body:has(#edad-teen:checked) .avatars-teen{display:block}
body:has(#edad-young:checked) .avatars-young{display:block}
body:has(#edad-adult:checked) .avatars-adult{display:block}
body:has(#av-child-m1:checked) label[for="av-child-m1"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-m2:checked) label[for="av-child-m2"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-m3:checked) label[for="av-child-m3"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-m4:checked) label[for="av-child-m4"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-m5:checked) label[for="av-child-m5"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-m6:checked) label[for="av-child-m6"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-m7:checked) label[for="av-child-m7"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-m8:checked) label[for="av-child-m8"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-m9:checked) label[for="av-child-m9"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-m10:checked) label[for="av-child-m10"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-f1:checked) label[for="av-child-f1"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-f2:checked) label[for="av-child-f2"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-f3:checked) label[for="av-child-f3"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-f4:checked) label[for="av-child-f4"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-f5:checked) label[for="av-child-f5"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-f6:checked) label[for="av-child-f6"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-f7:checked) label[for="av-child-f7"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-f8:checked) label[for="av-child-f8"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-f9:checked) label[for="av-child-f9"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-f10:checked) label[for="av-child-f10"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-m1:checked) label[for="av-teen-m1"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-m2:checked) label[for="av-teen-m2"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-m3:checked) label[for="av-teen-m3"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-m4:checked) label[for="av-teen-m4"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-m5:checked) label[for="av-teen-m5"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-m6:checked) label[for="av-teen-m6"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-m7:checked) label[for="av-teen-m7"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-m8:checked) label[for="av-teen-m8"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-m9:checked) label[for="av-teen-m9"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-m10:checked) label[for="av-teen-m10"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-f1:checked) label[for="av-teen-f1"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-f2:checked) label[for="av-teen-f2"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-f3:checked) label[for="av-teen-f3"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-f4:checked) label[for="av-teen-f4"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-f5:checked) label[for="av-teen-f5"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-f6:checked) label[for="av-teen-f6"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-f7:checked) label[for="av-teen-f7"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-f8:checked) label[for="av-teen-f8"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-f9:checked) label[for="av-teen-f9"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-teen-f10:checked) label[for="av-teen-f10"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-m1:checked) label[for="av-young-m1"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-m2:checked) label[for="av-young-m2"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-m3:checked) label[for="av-young-m3"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-m4:checked) label[for="av-young-m4"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-m5:checked) label[for="av-young-m5"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-m6:checked) label[for="av-young-m6"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-m7:checked) label[for="av-young-m7"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-m8:checked) label[for="av-young-m8"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-m9:checked) label[for="av-young-m9"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-m10:checked) label[for="av-young-m10"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-f1:checked) label[for="av-young-f1"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-f2:checked) label[for="av-young-f2"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-f3:checked) label[for="av-young-f3"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-f4:checked) label[for="av-young-f4"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-f5:checked) label[for="av-young-f5"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-f6:checked) label[for="av-young-f6"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-f7:checked) label[for="av-young-f7"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-f8:checked) label[for="av-young-f8"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-f9:checked) label[for="av-young-f9"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-young-f10:checked) label[for="av-young-f10"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-m1:checked) label[for="av-adult-m1"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-m2:checked) label[for="av-adult-m2"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-m3:checked) label[for="av-adult-m3"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-m4:checked) label[for="av-adult-m4"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-m5:checked) label[for="av-adult-m5"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-m6:checked) label[for="av-adult-m6"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-m7:checked) label[for="av-adult-m7"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-m8:checked) label[for="av-adult-m8"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-m9:checked) label[for="av-adult-m9"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-m10:checked) label[for="av-adult-m10"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-f1:checked) label[for="av-adult-f1"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-f2:checked) label[for="av-adult-f2"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-f3:checked) label[for="av-adult-f3"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-f4:checked) label[for="av-adult-f4"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-f5:checked) label[for="av-adult-f5"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-f6:checked) label[for="av-adult-f6"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-f7:checked) label[for="av-adult-f7"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-f8:checked) label[for="av-adult-f8"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-f9:checked) label[for="av-adult-f9"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-adult-f10:checked) label[for="av-adult-f10"]{opacity:1;border-color:var(--yellow);background:rgba(255,215,101,.13);box-shadow:0 0 22px rgba(255,215,101,.10)}
body:has(#av-child-m1:checked) .preview-child-m1{display:block}
body:has(#av-child-m2:checked) .preview-child-m2{display:block}
body:has(#av-child-m3:checked) .preview-child-m3{display:block}
body:has(#av-child-m4:checked) .preview-child-m4{display:block}
body:has(#av-child-m5:checked) .preview-child-m5{display:block}
body:has(#av-child-m6:checked) .preview-child-m6{display:block}
body:has(#av-child-m7:checked) .preview-child-m7{display:block}
body:has(#av-child-m8:checked) .preview-child-m8{display:block}
body:has(#av-child-m9:checked) .preview-child-m9{display:block}
body:has(#av-child-m10:checked) .preview-child-m10{display:block}
body:has(#av-child-f1:checked) .preview-child-f1{display:block}
body:has(#av-child-f2:checked) .preview-child-f2{display:block}
body:has(#av-child-f3:checked) .preview-child-f3{display:block}
body:has(#av-child-f4:checked) .preview-child-f4{display:block}
body:has(#av-child-f5:checked) .preview-child-f5{display:block}
body:has(#av-child-f6:checked) .preview-child-f6{display:block}
body:has(#av-child-f7:checked) .preview-child-f7{display:block}
body:has(#av-child-f8:checked) .preview-child-f8{display:block}
body:has(#av-child-f9:checked) .preview-child-f9{display:block}
body:has(#av-child-f10:checked) .preview-child-f10{display:block}
body:has(#av-teen-m1:checked) .preview-teen-m1{display:block}
body:has(#av-teen-m2:checked) .preview-teen-m2{display:block}
body:has(#av-teen-m3:checked) .preview-teen-m3{display:block}
body:has(#av-teen-m4:checked) .preview-teen-m4{display:block}
body:has(#av-teen-m5:checked) .preview-teen-m5{display:block}
body:has(#av-teen-m6:checked) .preview-teen-m6{display:block}
body:has(#av-teen-m7:checked) .preview-teen-m7{display:block}
body:has(#av-teen-m8:checked) .preview-teen-m8{display:block}
body:has(#av-teen-m9:checked) .preview-teen-m9{display:block}
body:has(#av-teen-m10:checked) .preview-teen-m10{display:block}
body:has(#av-teen-f1:checked) .preview-teen-f1{display:block}
body:has(#av-teen-f2:checked) .preview-teen-f2{display:block}
body:has(#av-teen-f3:checked) .preview-teen-f3{display:block}
body:has(#av-teen-f4:checked) .preview-teen-f4{display:block}
body:has(#av-teen-f5:checked) .preview-teen-f5{display:block}
body:has(#av-teen-f6:checked) .preview-teen-f6{display:block}
body:has(#av-teen-f7:checked) .preview-teen-f7{display:block}
body:has(#av-teen-f8:checked) .preview-teen-f8{display:block}
body:has(#av-teen-f9:checked) .preview-teen-f9{display:block}
body:has(#av-teen-f10:checked) .preview-teen-f10{display:block}
body:has(#av-young-m1:checked) .preview-young-m1{display:block}
body:has(#av-young-m2:checked) .preview-young-m2{display:block}
body:has(#av-young-m3:checked) .preview-young-m3{display:block}
body:has(#av-young-m4:checked) .preview-young-m4{display:block}
body:has(#av-young-m5:checked) .preview-young-m5{display:block}
body:has(#av-young-m6:checked) .preview-young-m6{display:block}
body:has(#av-young-m7:checked) .preview-young-m7{display:block}
body:has(#av-young-m8:checked) .preview-young-m8{display:block}
body:has(#av-young-m9:checked) .preview-young-m9{display:block}
body:has(#av-young-m10:checked) .preview-young-m10{display:block}
body:has(#av-young-f1:checked) .preview-young-f1{display:block}
body:has(#av-young-f2:checked) .preview-young-f2{display:block}
body:has(#av-young-f3:checked) .preview-young-f3{display:block}
body:has(#av-young-f4:checked) .preview-young-f4{display:block}
body:has(#av-young-f5:checked) .preview-young-f5{display:block}
body:has(#av-young-f6:checked) .preview-young-f6{display:block}
body:has(#av-young-f7:checked) .preview-young-f7{display:block}
body:has(#av-young-f8:checked) .preview-young-f8{display:block}
body:has(#av-young-f9:checked) .preview-young-f9{display:block}
body:has(#av-young-f10:checked) .preview-young-f10{display:block}
body:has(#av-adult-m1:checked) .preview-adult-m1{display:block}
body:has(#av-adult-m2:checked) .preview-adult-m2{display:block}
body:has(#av-adult-m3:checked) .preview-adult-m3{display:block}
body:has(#av-adult-m4:checked) .preview-adult-m4{display:block}
body:has(#av-adult-m5:checked) .preview-adult-m5{display:block}
body:has(#av-adult-m6:checked) .preview-adult-m6{display:block}
body:has(#av-adult-m7:checked) .preview-adult-m7{display:block}
body:has(#av-adult-m8:checked) .preview-adult-m8{display:block}
body:has(#av-adult-m9:checked) .preview-adult-m9{display:block}
body:has(#av-adult-m10:checked) .preview-adult-m10{display:block}
body:has(#av-adult-f1:checked) .preview-adult-f1{display:block}
body:has(#av-adult-f2:checked) .preview-adult-f2{display:block}
body:has(#av-adult-f3:checked) .preview-adult-f3{display:block}
body:has(#av-adult-f4:checked) .preview-adult-f4{display:block}
body:has(#av-adult-f5:checked) .preview-adult-f5{display:block}
body:has(#av-adult-f6:checked) .preview-adult-f6{display:block}
body:has(#av-adult-f7:checked) .preview-adult-f7{display:block}
body:has(#av-adult-f8:checked) .preview-adult-f8{display:block}
body:has(#av-adult-f9:checked) .preview-adult-f9{display:block}
body:has(#av-adult-f10:checked) .preview-adult-f10{display:block}
.avatar-wait{padding:18px;border:1px dashed #365b77;border-radius:14px;color:var(--muted);text-align:center}body:has(input[name="edad"]:checked) .avatar-wait{display:none}.inicio-partida{text-align:center}.start-button{display:inline-block;margin-top:10px;padding:16px 30px;border:1px solid #38566f;border-radius:14px;background:#132335;color:#67849a;font-weight:900;letter-spacing:.05em;cursor:not-allowed;pointer-events:none;box-shadow:none}.start-help{margin-top:10px;color:var(--muted);font-size:.9rem}
body:has(#nombre-jugador:valid):has(#edad-child:checked):has(input[id^="av-child-"]:checked) .start-button,body:has(#nombre-jugador:valid):has(#edad-teen:checked):has(input[id^="av-teen-"]:checked) .start-button,body:has(#nombre-jugador:valid):has(#edad-young:checked):has(input[id^="av-young-"]:checked) .start-button,body:has(#nombre-jugador:valid):has(#edad-adult:checked):has(input[id^="av-adult-"]:checked) .start-button{pointer-events:auto;cursor:pointer;color:#03111d;border-color:#62efff;background:linear-gradient(135deg,var(--cyan),#78a5ff 58%,var(--purple));box-shadow:0 12px 34px rgba(55,216,255,.22)}
body:has(#partida-activa:checked) .registro-overlay{min-height:auto;padding:8px 14px;position:sticky;top:0;background:rgba(4,12,21,.96);backdrop-filter:blur(14px);border-bottom:1px solid #2a4b66;z-index:80}body:has(#partida-activa:checked) .registro-overlay .setup-only{display:none}body:has(#partida-activa:checked) .registro-overlay .perfil-persistente{margin:0 auto;padding:8px 10px;border:0;background:transparent;box-shadow:none;grid-template-columns:1.15fr 2fr auto}body:has(#partida-activa:checked) .registro-overlay .avatar-preview{width:54px;height:54px;border-radius:14px}body:has(#partida-activa:checked) .registro-overlay .avatar-preview-item{font-size:2rem}body:has(#partida-activa:checked) .registro-overlay .nombre-jugador input{padding:8px 10px;background:#081725}body:has(#partida-activa:checked) .registro-overlay .hud-mini{min-height:56px;padding:5px 7px}body:has(#partida-activa:checked) .registro-overlay .hud-mini strong{font-size:1.18rem}body:has(#partida-activa:checked) .registro-overlay .editar-perfil{display:block}
.menu-juego{position:sticky;top:72px;z-index:60;max-width:1180px;margin:0 auto 16px;padding:10px 12px;border:1px solid #284963;border-top:0;border-radius:0 0 16px 16px;background:rgba(6,16,27,.94);backdrop-filter:blur(12px)}.menu-juego p{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:0}.menu-juego a{padding:9px 12px;border:1px solid #2c4b65;border-radius:10px;background:#0d2032;color:#e6f8ff;text-decoration:none;font-weight:800;font-size:.84rem;transition:.17s}.menu-juego a:hover{transform:translateY(-2px);border-color:var(--cyan);background:#12314c}
main{max-width:1180px;margin:0 auto}.pantalla{scroll-margin-top:150px;min-height:82vh;margin:22px 0;padding:clamp(24px,4vw,48px);border:1px solid #223e56;border-radius:26px;background:linear-gradient(145deg,rgba(14,28,44,.97),rgba(7,18,30,.97));box-shadow:0 24px 80px rgba(0,0,0,.3);position:relative;overflow:hidden}.pantalla::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 0 47%,rgba(255,255,255,.015) 48%,transparent 49%)}.nivel-tag{display:inline-block;margin:0 0 8px;padding:6px 9px;border:1px solid #315a78;border-radius:999px;color:var(--cyan);font-size:.72rem;font-weight:900;letter-spacing:.1em}
.barra-progreso{width:100%;height:17px;border:1px solid #31516d;border-radius:99px;background:#06111c;overflow:hidden}.progreso-dinamico{height:100%;width:var(--progress-width);background:linear-gradient(90deg,var(--green),var(--cyan),var(--purple),var(--pink));box-shadow:0 0 24px rgba(55,216,255,.34);transition:width .4s ease}.progreso-valor::after{content:var(--progress)}iframe{display:block;width:min(100%,820px);aspect-ratio:16/9;margin:18px auto;border:1px solid #3a607d;border-radius:16px;background:#000}.link-video{display:inline-block;padding:8px 11px;border:1px solid #365b77;border-radius:9px;text-decoration:none}fieldset{padding:22px;border:1px solid #365a76;border-radius:18px;background:rgba(5,16,27,.58)}legend{padding:0 8px;color:var(--cyan);font-weight:900}.opciones-juego>input[type="radio"],.opciones-juego>input[type="checkbox"]{position:absolute;opacity:0;pointer-events:none}.opcion{display:block;margin:10px 0;padding:14px 16px;border:1px solid #31516d;border-radius:13px;background:#0b2033;color:#eefaff;cursor:pointer;transition:.16s}.opcion:hover{transform:translateX(5px);border-color:var(--cyan);background:#10314c}.opciones-juego>input:checked+.opcion{border-color:var(--yellow);background:rgba(255,215,101,.12);box-shadow:0 0 20px rgba(255,215,101,.08)}.feedback{display:none;margin-top:20px;padding:18px;border-radius:15px}.feedback-bien{border:1px solid rgba(64,227,140,.5);background:rgba(64,227,140,.09)}textarea{width:100%;padding:12px 13px;border:1px solid #3b5f7b;border-radius:11px;background:#061522;color:var(--text);font:inherit;outline:none;resize:vertical}textarea:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(55,216,255,.1)}footer{max-width:1180px;margin:24px auto 60px;padding:22px;border-top:1px solid #2c4b64;color:var(--muted);text-align:center}
/* Puntaje, gemas y progreso: comienzan en cero y cambian según los niveles resueltos. */
body:has(#partida-activa:checked){--progress:"0%";--progress-width:0%}

/* Nivel 2 superado al marcar por lo menos tres de las cuatro señales correctas. */

/* Vidas: la partida comienza con 5. Sin JavaScript, CSS refleja las decisiones inseguras que permanecen seleccionadas. */
body:has(#n1-a:checked,#n1-b:checked,#n1-d:checked),body:has(#r1:checked,#r2:checked,#r4:checked){--lives:"4"}
body:has(#n1-a:checked,#n1-b:checked,#n1-d:checked):has(#r1:checked,#r2:checked,#r4:checked){--lives:"3"}

@media(max-width:1050px){.avatar-grid{grid-template-columns:repeat(5,1fr)}.hud-compacto{grid-template-columns:repeat(2,1fr)}.perfil-persistente{grid-template-columns:1fr}.editar-perfil{justify-self:start}.como-jugar{grid-template-columns:repeat(2,1fr)}.menu-juego{top:164px}}
@media(max-width:720px){.registro-overlay{padding:26px 14px}.reglas-claras,.como-jugar,.age-grid{grid-template-columns:1fr}.avatar-grid{grid-template-columns:repeat(4,1fr)}.perfil-identidad{align-items:flex-start}.avatar-preview{flex:0 0 auto}.hud-compacto{grid-template-columns:repeat(2,1fr)}body:has(#partida-activa:checked) .registro-overlay .perfil-persistente{grid-template-columns:1fr}.menu-juego{position:relative;top:0;border-radius:0}.pantalla{min-height:auto;margin:14px 10px;padding:22px 16px;border-radius:18px}fieldset{padding:15px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* V3 · entrenamiento distribuido por dificultad */
.paso-registro-mini{margin:0 0 6px;color:var(--cyan);font-size:.76rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.teclado-help{max-width:780px;margin:12px auto 0;color:var(--muted);font-size:.9rem;text-align:center}

.material-nivel{margin:22px 0;padding:22px;border:1px solid #365a76;border-radius:20px;background:linear-gradient(145deg,rgba(11,32,51,.96),rgba(7,20,34,.96));box-shadow:0 18px 40px rgba(0,0,0,.16)}
.material-cabecera{display:flex;align-items:center;gap:16px;margin-bottom:12px}.material-icono{margin:0;font-size:3rem;filter:drop-shadow(0 0 18px rgba(55,216,255,.18))}.material-tag{margin:0 0 2px;color:var(--muted);font-size:.73rem;font-weight:900;letter-spacing:.11em}.material-cabecera h3{margin:0}

/* Indicador visible cuando se navega con teclado sobre radios ocultos */
.age-grid .control-opcion:focus-visible+label,.avatar-grid .control-opcion:focus-visible+label{outline:3px solid var(--yellow);outline-offset:4px}
@media(max-width:720px){.material-cabecera{align-items:flex-start}.material-icono{font-size:2.4rem}}

/* =========================================================
   V4 · NIVEL 0, REGLAS PREVIAS Y CRONÓMETRO DESDE NIVEL 1
   ========================================================= */
.timer-state::after{content:"detenido · inicia en Nivel 1"}
body:has(#nivel-1-activo:checked) .timer-state::after{content:"en curso · meta 25 min"}

.progreso-hud{grid-column:1/-1;padding:9px 12px;border:1px solid #29465f;border-radius:13px;background:#071624}
.progreso-hud-top{display:flex;justify-content:space-between;gap:16px;margin-bottom:6px;color:var(--muted);font-size:.72rem;letter-spacing:.06em}
.progreso-hud .barra-progreso{height:10px}

/* Al iniciar la partida se ve solamente el Nivel 0. La campaña real aparece al aceptar las reglas. */

.nivel-cero{border-color:rgba(255,215,101,.48);background:radial-gradient(circle at 50% 0,rgba(255,215,101,.08),transparent 30%),linear-gradient(145deg,rgba(14,28,44,.98),rgba(7,18,30,.98))}

.start-level-button{display:inline-block;margin-top:12px;padding:16px 24px;border-radius:14px;background:linear-gradient(135deg,var(--green),var(--cyan));color:#03131b;font-weight:1000;letter-spacing:.03em;cursor:pointer;box-shadow:0 14px 34px rgba(55,216,255,.22);transition:.18s}
.start-level-button:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(55,216,255,.3)}
#nivel-1-activo:focus-visible+.start-level-button{outline:3px solid var(--yellow);outline-offset:5px}

/* Antes del Nivel 1: valores iniciales explícitos. */
body:has(#partida-activa:checked):not(:has(#nivel-1-activo:checked)){--score:"0";--gems:"0";--lives:"5";--progress:"0%";--progress-width:0%}

@media(max-width:620px){.progreso-hud-top{flex-direction:column;gap:2px}}

html{scroll-behavior:smooth;scroll-padding-top:190px}

.navegacion-flotante{pointer-events:none}
.nav-float{position:fixed;left:50%;z-index:120;display:none;align-items:center;justify-content:center;width:54px;height:54px;transform:translateX(-50%);border:2px solid rgba(255,255,255,.85);border-radius:50%;background:rgba(7,22,36,.94);color:#fff;box-shadow:0 10px 34px rgba(0,0,0,.38),0 0 22px rgba(55,216,255,.16);text-decoration:none;font-size:2rem;font-weight:900;line-height:1;pointer-events:auto;backdrop-filter:blur(10px);transition:.18s}
.nav-float:hover,.nav-float:focus-visible{border-color:var(--cyan);background:#10314c;box-shadow:0 10px 34px rgba(0,0,0,.42),0 0 28px rgba(55,216,255,.36);outline:none}
.nav-subir{top:198px}
.nav-subir:hover,.nav-subir:focus-visible{transform:translateX(-50%) translateY(-4px) scale(1.06)}
.nav-bajar{bottom:22px;animation:floatArrow 1.6s ease-in-out infinite}
.nav-bajar:hover,.nav-bajar:focus-visible{animation:none;transform:translateX(-50%) translateY(4px) scale(1.06)}
@keyframes floatArrow{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(7px)}}
body:has(#nivel-1-activo:checked) .nav-subir{display:flex}

.asistente-control{position:fixed;opacity:0;pointer-events:none}
.byte-help-button{position:fixed;right:22px;bottom:22px;z-index:140;display:flex;align-items:center;gap:9px;padding:10px 15px 10px 10px;border:2px solid var(--cyan);border-radius:999px;background:linear-gradient(135deg,#0b2236,#103957);color:#fff;box-shadow:0 12px 34px rgba(0,0,0,.42),0 0 24px rgba(55,216,255,.24);cursor:pointer;user-select:none;transition:.18s}
.byte-help-button:hover{transform:translateY(-3px);box-shadow:0 14px 38px rgba(0,0,0,.46),0 0 30px rgba(55,216,255,.4)}
.byte-help-icon{display:grid;place-items:center;width:39px;height:39px;border-radius:50%;background:#071624;font-size:1.55rem}
.byte-help-label{font-size:.78rem;font-weight:900;letter-spacing:.08em}
.byte-help-panel{position:fixed;right:22px;bottom:88px;z-index:139;width:min(390px,calc(100vw - 32px));max-height:min(570px,72vh);overflow:auto;padding:0;border:1px solid rgba(55,216,255,.55);border-radius:22px;background:linear-gradient(160deg,rgba(8,27,44,.98),rgba(7,18,31,.98));color:var(--text);box-shadow:0 22px 70px rgba(0,0,0,.56),0 0 30px rgba(55,216,255,.13);opacity:0;visibility:hidden;transform:translateY(14px) scale(.97);transform-origin:bottom right;transition:.18s}
#byte-help-toggle:checked ~ .byte-help-panel{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.byte-help-header{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 18px;border-bottom:1px solid rgba(55,216,255,.28);background:#0a2237}
.byte-help-header h2{margin:2px 0 0;color:var(--cyan)}
.byte-help-kicker{margin:0;color:var(--green);font-size:.7rem;font-weight:900;letter-spacing:.14em}
.byte-help-close{display:grid;place-items:center;width:36px;height:36px;border:1px solid #3b627f;border-radius:50%;cursor:pointer;font-size:1.45rem;line-height:1}
.byte-help-close:hover{border-color:var(--red);color:var(--red)}
.byte-help-tip{display:none;padding:18px}
.byte-help-tip h3{margin-top:0;color:#fff}
.byte-help-tip ol{padding-left:22px}

@media(max-width:760px){
    
    
    .nav-subir{top:auto;bottom:88px;left:22px;transform:none}
    .nav-subir:hover,.nav-subir:focus-visible{transform:translateY(-4px) scale(1.05)}
    .nav-bajar{width:50px;height:50px}
    .byte-help-button{right:14px;bottom:14px;padding-right:11px}
    .byte-help-label{display:none}
    .byte-help-panel{right:14px;bottom:74px;width:calc(100vw - 28px)}
}

/* =========================================================
   V6 · Botones flotantes verticales SIEMPRE VISIBLES
   dentro de la etapa correspondiente. Solo HTML + CSS.
   ========================================================= */

/* La regla base de V5 los ocultaba. En V6 controlamos cada
   flecha según la etapa para que realmente se vea. */
.navegacion-flotante{
    position:relative;
    z-index:300;
    pointer-events:none;
}

.nav-float{
    position:fixed;
    left:50%;
    z-index:300;
    display:none;
    align-items:center;
    justify-content:center;
    width:58px;
    height:58px;
    border:3px solid rgba(255,255,255,.95);
    border-radius:50%;
    background:linear-gradient(145deg,#0d314b,#071927);
    color:#ffffff;
    text-decoration:none;
    font-size:2.25rem;
    font-weight:900;
    line-height:1;
    pointer-events:auto;
    box-shadow:
        0 12px 34px rgba(0,0,0,.48),
        0 0 0 5px rgba(55,216,255,.10),
        0 0 28px rgba(55,216,255,.32);
    transition:transform .18s ease, background-color .18s ease,
               border-color .18s ease, box-shadow .18s ease;
}

.nav-subir{
    top:18px;
    transform:translateX(-50%);
}

.nav-bajar{
    bottom:18px;
    transform:translateX(-50%);
    animation:flechaAbajoV6 1.45s ease-in-out infinite;
}

.nav-float:hover,
.nav-float:focus-visible{
    border-color:var(--cyan);
    background:linear-gradient(145deg,#155278,#0d314b);
    box-shadow:
        0 14px 38px rgba(0,0,0,.52),
        0 0 0 7px rgba(55,216,255,.13),
        0 0 36px rgba(55,216,255,.48);
    outline:none;
}

.nav-subir:hover,
.nav-subir:focus-visible{
    transform:translateX(-50%) translateY(-4px) scale(1.08);
}

.nav-bajar:hover,
.nav-bajar:focus-visible{
    animation:none;
    transform:translateX(-50%) translateY(4px) scale(1.08);
}

@keyframes flechaAbajoV6{
    0%,100%{transform:translateX(-50%) translateY(0)}
    50%{transform:translateX(-50%) translateY(8px)}
}

/* REGISTRO: las dos flechas ya están disponibles. */
body:not(:has(#partida-activa:checked)) .nav-subir-registro,
body:not(:has(#partida-activa:checked)) .nav-bajar-registro{
    display:flex;
}

/* Al comenzar la partida desaparecen las flechas de registro. */
body:has(#partida-activa:checked) .nav-subir-registro,
body:has(#partida-activa:checked) .nav-bajar-registro{
    display:none;
}

/* JUEGO: la flecha superior permanece visible durante toda la partida. */

/* Nivel 0: todavía no empezó el reloj. */

/* Nivel 1: bajar directamente al desafío. */

/* Nivel 2: cuando Nivel 1 está superado. */

/* Si ya encontró al menos tres pistas correctas, el botón inferior
   pasa a apuntar al desafío del Nivel 3. */

/* Nivel 3 completado: el botón inferior conduce al jefe final. */

/* Para que los destinos no queden ocultos bajo el HUD. */
#registro,
#inicio-partida,
#menu-principal{
    scroll-margin-top:210px;
}

@media(max-width:760px){
    .nav-float{
        width:52px;
        height:52px;
        font-size:2rem;
    }

    /* En móvil siguen centradas arriba y abajo, como en el boceto. */
    .nav-subir{
        top:12px;
        left:50%;
        bottom:auto;
        transform:translateX(-50%);
    }

    .nav-bajar{
        bottom:14px;
        left:50%;
    }

    .nav-subir:hover,
    .nav-subir:focus-visible{
        transform:translateX(-50%) translateY(-3px) scale(1.06);
    }
}

/* =========================================================
   V7 · intentos, vidas y puntaje sin JavaScript
   ========================================================= */

body{
    --e-n1a:0;--e-n1b:0;--e-n1d:0;
    --e-n2a:0;--e-n2b:0;--e-n2d:0;
    --e-n3a:0;--e-n3b:0;--e-n3d:0;
    --p1:0;--p2:0;--p3:0;
}

.vidas-valor{
    counter-reset:vidas-restantes max(0,calc(
        5
        - var(--e-n1a) - var(--e-n1b) - var(--e-n1d)
        - var(--e-n2a) - var(--e-n2b) - var(--e-n2d)
        - var(--e-n3a) - var(--e-n3b) - var(--e-n3d)
    ));
}
.vidas-valor::after{content:counter(vidas-restantes)}

.puntaje-valor{counter-reset:puntos-totales calc(var(--p1) + var(--p2) + var(--p3))}
.puntaje-valor::after{content:counter(puntos-totales)}

body{--gems:"0";--progress:"0%";--progress-width:0%}

/* Desaparecer automáticamente en el extremo superior/inferior. */
@supports (animation-timeline: scroll()){
    .nav-subir{animation:navSubirExtremo linear both;animation-timeline:scroll(root block)}
    .nav-bajar{animation:navBajarExtremo linear both;animation-timeline:scroll(root block)}

    @keyframes navSubirExtremo{
        0%,0.25%{opacity:0;visibility:hidden;pointer-events:none}
        0.8%,100%{opacity:1;visibility:visible;pointer-events:auto}
    }
    @keyframes navBajarExtremo{
        0%,99.2%{opacity:1;visibility:visible;pointer-events:auto}
        99.75%,100%{opacity:0;visibility:hidden;pointer-events:none}
    }
}

/* Una vez usado un intento, el control queda cerrado para que no pueda
   desmarcarse accidentalmente con teclado y recuperar una vida. */

/* =========================================================
   V8 · Campaña de 5 niveles
   Mantiene la estética anterior pero simplifica el flujo.
   Todo funciona con HTML + CSS, sin JavaScript.
   ========================================================= */

html{
    scroll-behavior:smooth;
    scroll-padding-top:185px;
}

body{
    --score-max:500;
    --gems:"0";
    --progress:"0%";
    --progress-width:0%;
    --p1:0;--p2:0;--p3:0;--p4:0;--p5:0;
}

/* ---------- Flujo general ---------- */

.game-v8 .menu-v8,
.game-v8 .campania-v8{
    display:none;
}

.campania-v8{display:none}
body:has(#nivel-1-activo:checked) .campania-v8{display:block}

/* ---------- HUD ---------- */

.puntaje-valor{
    counter-reset:puntos-v8 calc(var(--p1) + var(--p2) + var(--p3) + var(--p4) + var(--p5));
}
.puntaje-valor::after{content:counter(puntos-v8)}

/* Cada nivel usa 5 vidas propias. */
.vidas-valor{counter-reset:vidas-v8 5}
.vidas-valor::after{content:counter(vidas-v8)}

body:has(#nivel-1-activo:checked):not(:has(#l1-ok:checked)) .vidas-valor{
    counter-reset:vidas-v8 calc(5 - var(--e-l1a,0) - var(--e-l1b,0) - var(--e-l1c,0) - var(--e-l1d,0) - var(--e-l1e,0));
}

/* ---------- Disparador ---------- */

/* ---------- Recursos flotantes ---------- */

.resource-button{
    position:fixed;
    left:20px;
    bottom:22px;
    z-index:145;
    display:none;
    align-items:center;
    gap:8px;
    padding:11px 14px;
    border:2px solid #8e6cff;
    border-radius:999px;
    background:linear-gradient(135deg,#1a1838,#17142c);
    color:#fff;
    box-shadow:0 12px 34px rgba(0,0,0,.42),0 0 26px rgba(142,108,255,.23);
    cursor:pointer;
}

.resource-panel{
    position:fixed;
    left:20px;
    bottom:82px;
    z-index:144;
    width:min(430px,calc(100vw - 30px));
    max-height:75vh;
    overflow:auto;
    padding:18px;
    border:1px solid rgba(142,108,255,.55);
    border-radius:22px;
    background:rgba(7,18,31,.98);
    box-shadow:0 24px 70px rgba(0,0,0,.6);
    opacity:0;
    visibility:hidden;
    transform:translateY(12px) scale(.97);
    transform-origin:bottom left;
    transition:.18s;
}
#resource-toggle:checked ~ .resource-panel{
    opacity:1;
    visibility:visible;
    transform:none;
}
.resource-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}
.resource-header h2{margin:2px 0 8px}
.resource-header small{color:var(--purple)}
.resource-close{
    display:grid;
    place-items:center;
    width:36px;height:36px;
    border:1px solid #5f508a;
    border-radius:50%;
    cursor:pointer;
    font-size:1.4rem;
}
.resource-panel iframe{margin:14px 0}
.resource-panel img{
    width:100%;
    height:auto;
    margin-top:14px;
    border:1px solid #355a76;
    border-radius:14px;
}

/* ---------- Menú limpio ---------- */

.menu-v8{
    display:none;
    gap:12px;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    padding:12px 16px;
}

.menu-v8>a,.menu-niveles a{
    text-decoration:none;
}
.menu-home{
    padding:10px 13px;
    border:1px solid #395f7c;
    border-radius:12px;
    color:#dff6ff;
    background:#0b2032;
}
.menu-niveles{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    justify-content:center;
}
.menu-level{
    display:flex;
    align-items:center;
    gap:7px;
    padding:9px 12px;
    border:1px solid #31536f;
    border-radius:12px;
    color:#aabfd0;
    background:#091927;
    pointer-events:none;
    opacity:.42;
}
.menu-level span{
    display:grid;
    place-items:center;
    width:25px;height:25px;
    border-radius:50%;
    background:#153148;
    color:#fff;
    font-weight:900;
}
body:has(#nivel-1-activo:checked) .menu-l1{
    pointer-events:auto;
    opacity:1;
    border-color:var(--cyan);
}

/* ---------- Nivel 0 ---------- */

.nivel0-v8{
    min-height:auto;
}
.reglas-v8-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px;
    margin:22px 0 30px;
}
.reglas-v8-grid article{
    padding:18px;
    border:1px solid #31536f;
    border-radius:18px;
    background:#091a2a;
}
.reglas-v8-grid span{font-size:2rem}
.reglas-v8-grid h3{margin:8px 0}
.reglas-v8-grid p{margin:0;color:var(--muted)}

.mapa-v8{
    margin:28px 0;
    padding:22px;
    border:1px solid #31536f;
    border-radius:22px;
    background:linear-gradient(145deg,#081827,#0a2033);
}
.ruta-v8{
    position:relative;
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:12px;
    margin-top:20px;
}
.ruta-v8::before{
    content:"";
    position:absolute;
    left:8%;
    right:8%;
    top:34px;
    height:4px;
    background:linear-gradient(90deg,#40e38c,#37d8ff,#8e6cff,#ff53b2);
    opacity:.35;
}
.ruta-node{
    position:relative;
    z-index:2;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:5px;
    padding:12px;
    text-align:center;
    text-decoration:none;
    color:#b8cedf;
}
.node-badge{
    display:grid;
    place-items:center;
    width:64px;height:64px;
    border:2px solid #3a5f7b;
    border-radius:50%;
    background:#0a1a28;
    color:#fff;
    font-size:1.25rem;
    font-weight:900;
}
.node-check{display:none;color:#03150c;font-size:1.5rem}
.ruta-node small{color:var(--muted)}
.ruta-node.bloqueado{opacity:.38;pointer-events:none}

body:has(#nivel-1-activo:checked) .node-l1{
    opacity:1;
    pointer-events:auto;
}

/* ---------- Cinco niveles ---------- */

body:has(#nivel-1-activo:checked) #nivel-1{display:block}

.material-v8{
    margin:22px 0;
}
.regla-nivel-v8{
    margin:18px 0 0;
    padding:14px 16px;
    border:1px solid rgba(255,215,101,.48);
    border-radius:14px;
    background:rgba(255,215,101,.07);
    color:#fff6ce;
    font-weight:900;
}
.caso-v8{
    padding:20px;
    border:1px solid rgba(255,94,111,.4);
    border-radius:18px;
    background:linear-gradient(135deg,rgba(255,94,111,.1),rgba(255,83,178,.045));
}
.caso-kicker{
    margin:0 0 8px;
    color:var(--cyan);
    font-size:.74rem;
    font-weight:900;
    letter-spacing:.13em;
}
.desafio-v8{
    margin-top:22px;
    padding:22px;
    border:1px solid #355a76;
    border-radius:20px;
    background:rgba(5,16,27,.55);
}
.desafio-top{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:18px;
    margin-bottom:14px;
}
.desafio-top h3{margin:2px 0}
.intentos-v8{
    min-width:205px;
    padding:11px 13px;
    border:1px solid #365b77;
    border-radius:13px;
    background:#071827;
    text-align:right;
}
.intentos-v8 strong{display:block;color:var(--yellow)}
.intentos-v8 small{color:var(--muted)}

.opciones-juego>input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}
.opcion{
    display:flex;
    align-items:center;
    gap:12px;
}
.opcion-letra{
    flex:0 0 auto;
    display:grid;
    place-items:center;
    width:32px;height:32px;
    border-radius:50%;
    background:#17344d;
    color:#fff;
    font-weight:900;
}

/* Ocultar intentos ya utilizados para que no puedan desmarcarse. */

/* Feedback genérico por nivel y bloqueo al acertar */

/* Puntaje por intento: 1.º 100 · 2.º 50 · 3.º 25 · 4.º 10 · 5.º 0 */

/* ---------- Desbloqueo secuencial ---------- */

/* ---------- Pantalla final ---------- */

/* ---------- Game over ---------- */
.game-over-overlay{
    position:fixed;
    inset:0;
    z-index:300;
    display:none;
    place-items:center;
    padding:20px;
    background:rgba(2,8,14,.9);
    backdrop-filter:blur(12px);
}
.game-over-card{
    width:min(560px,100%);
    padding:34px;
    border:2px solid var(--red);
    border-radius:26px;
    background:
        radial-gradient(circle at 50% 0%,rgba(255,94,111,.18),transparent 32%),
        linear-gradient(145deg,#19101a,#08131f);
    box-shadow:0 28px 90px rgba(0,0,0,.7);
    text-align:center;
}
.game-over-icon{font-size:5rem;margin:0}
.game-over-card h2{font-size:clamp(2rem,5vw,3.4rem);margin:.2em 0}
.restart-button{
    display:inline-block;
    margin-top:18px;
    padding:14px 20px;
    border:2px solid var(--red);
    border-radius:14px;
    background:var(--red);
    color:#fff;
    font-weight:900;
    text-decoration:none;
}

/* ---------- Asistente contextual ---------- */
.byte-v8 .byte-help-tip{display:none}

body:has(#nivel-1-activo:checked):not(:has(#l1-ok:checked)) .help-l1{display:block}

/* ---------- Navegación flotante contextual ---------- */
.nav-float{display:none}
body:not(:has(#partida-activa:checked)) .nav-subir-registro,
body:not(:has(#partida-activa:checked)) .nav-bajar-registro{display:flex}

body:has(#nivel-1-activo:checked):not(:has(#l1-ok:checked)) .nav-down-l1{display:flex}

/* Ocultar automáticamente flechas en extremos del documento. */
@supports (animation-timeline: scroll()){
    .nav-subir{
        animation:navSubirV8 linear both;
        animation-timeline:scroll(root block);
    }
    .nav-bajar{
        animation:navBajarV8 linear both;
        animation-timeline:scroll(root block);
    }
    @keyframes navSubirV8{
        0%,.3%{opacity:0;visibility:hidden;pointer-events:none}
        1%,100%{opacity:1;visibility:visible;pointer-events:auto}
    }
    @keyframes navBajarV8{
        0%,99%{opacity:1;visibility:visible;pointer-events:auto}
        99.7%,100%{opacity:0;visibility:hidden;pointer-events:none}
    }
}

/* ---------- Ajustes visuales ---------- */

body:not(:has(#disparador-visto:checked)) .byte-help-button{display:none}

@media(max-width:900px){
    .reglas-v8-grid{grid-template-columns:1fr 1fr}
    .ruta-v8{grid-template-columns:1fr}
    .ruta-v8::before{display:none}
    
    .desafio-top{flex-direction:column}
    .intentos-v8{width:100%;text-align:left}
}

@media(max-width:620px){
    .reglas-v8-grid{grid-template-columns:1fr}
    .menu-niveles{display:grid;grid-template-columns:1fr 1fr;width:100%}
    .resource-button strong{display:none}
    .resource-button{width:48px;height:48px;justify-content:center;padding:0}
    .resource-panel{left:12px;bottom:76px;width:calc(100vw - 24px)}
}

/* =========================================================
   V9 · Primeros pasos + HUD más compacto
   Mantiene la estética V8.
   ========================================================= */

/* Flujo: ya no existe una pantalla de disparador separada. */
body:has(#partida-activa:checked):not(:has(#nivel-1-activo:checked)) #primeros-pasos{
    display:block !important;
}
body:has(#nivel-1-activo:checked) #primeros-pasos{
    display:none !important;
}
body:has(#partida-activa:checked) .menu-v8{
    display:flex !important;
}
body:has(#nivel-1-activo:checked) .campania-v8{
    display:block !important;
}

/* El recurso aparece recién cuando las evidencias dejan Primeros pasos. */
.resource-button{
    display:none !important;
}
body:has(#nivel-1-activo:checked) .resource-button{
    display:flex !important;
}

/* BYTE se muestra durante Primeros pasos y toda la partida. */
body:has(#partida-activa:checked) .byte-help-button{
    display:flex !important;
}

/* Navegación flotante de Primeros pasos. */

/* ---------------------------------------------------------
   Perfil persistente:
   nombre → engranaje → vidas/puntaje/gemas/tiempo
   --------------------------------------------------------- */
body:has(#partida-activa:checked) .registro-overlay .perfil-persistente{
    grid-template-columns:minmax(290px,1.15fr) 48px minmax(470px,2fr) !important;
    gap:10px !important;
    padding:6px 10px !important;
}
body:has(#partida-activa:checked) .registro-overlay .editar-perfil-icon{
    display:grid !important;
    place-items:center;
    align-self:center;
    justify-self:center;
    width:42px;
    height:42px;
    padding:0;
    border:1px solid #365d7d;
    border-radius:50%;
    background:#081725;
    color:#dff6ff;
    font-size:1.22rem;
    cursor:pointer;
    box-shadow:0 8px 20px rgba(0,0,0,.22);
    transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
body:has(#partida-activa:checked) .registro-overlay .editar-perfil-icon:hover{
    transform:rotate(30deg) scale(1.06);
    border-color:var(--cyan);
    box-shadow:0 0 20px rgba(55,216,255,.22);
}
body:has(#partida-activa:checked) .registro-overlay .progreso-hud{
    grid-column:1/-1;
    padding:6px 10px;
}
body:has(#partida-activa:checked) .registro-overlay .avatar-preview{
    width:50px;
    height:50px;
}
body:has(#partida-activa:checked) .registro-overlay .hud-mini{
    min-height:50px;
    padding:4px 6px;
}
body:has(#partida-activa:checked) .registro-overlay .hud-mini strong{
    margin:1px 0;
}

/* ---------------------------------------------------------
   Primeros pasos
   --------------------------------------------------------- */
.primeros-pasos-v9{
    display:none;
    padding-top:24px;
    background:
        radial-gradient(circle at 50% 0%,rgba(55,216,255,.12),transparent 30%),
        linear-gradient(145deg,#0b1627,#08131f);
}

/* La pantalla "Primeros pasos" ya contiene el video arriba:
   el menú se mantiene compacto para que el video suba visualmente. */
body:has(#partida-activa:checked) .menu-v8{
    margin-top:8px;
    padding:8px 12px;
}

/* ---------------------------------------------------------
   Responsive
   --------------------------------------------------------- */
@media(max-width:1050px){
    body:has(#partida-activa:checked) .registro-overlay .perfil-persistente{
        grid-template-columns:minmax(0,1fr) 46px !important;
    }
    body:has(#partida-activa:checked) .registro-overlay .hud-compacto{
        grid-column:1/-1;
    }
    body:has(#partida-activa:checked) .registro-overlay .progreso-hud{
        grid-column:1/-1;
    }
}

@media(max-width:720px){
    
    body:has(#partida-activa:checked) .registro-overlay .perfil-persistente{
        grid-template-columns:1fr 44px !important;
    }
    body:has(#partida-activa:checked) .registro-overlay .perfil-identidad{
        min-width:0;
    }
}

/* =========================================================
   V10 · Video visible + HUD superior ultracompacto
   Mantiene la estética anterior y no utiliza JavaScript.
   ========================================================= */

/* ---------------------------------------------------------
   1. PRIMEROS PASOS: SOLO TÍTULO ARRIBA DEL VIDEO
   --------------------------------------------------------- */
.primeros-pasos-v9{
    padding-top:14px;
}

/* El video queda dimensionado para entrar completo en una notebook
   junto con su título y el HUD fino. */

/* El texto explicativo que antes estaba encima pasa debajo del video. */

/* ---------------------------------------------------------
   2. HUD SUPERIOR SIEMPRE VISIBLE, MUCHO MÁS FINO
   nombre + avatar + engranaje + datos
   --------------------------------------------------------- */
body:has(#partida-activa:checked) .registro-overlay{
    position:fixed !important;
    top:0;
    left:0;
    right:0;
    z-index:170;
    min-height:0 !important;
    height:48px;
    padding:0 !important;
    border:0;
    border-bottom:1px solid rgba(55,216,255,.22);
    background:rgba(4,12,21,.90);
    backdrop-filter:blur(14px);
    box-shadow:0 8px 28px rgba(0,0,0,.20);
}

/* Todo lo grande del registro queda oculto durante la partida. */
body:has(#partida-activa:checked) .registro-overlay .setup-only,
body:has(#partida-activa:checked) .registro-overlay .registro-configuracion{
    display:none !important;
}

body:has(#partida-activa:checked) .registro-overlay .perfil-persistente{
    max-width:1180px;
    height:47px;
    margin:0 auto !important;
    padding:4px 12px !important;
    display:grid !important;
    grid-template-columns:minmax(200px,1.2fr) 34px minmax(440px,2fr) !important;
    gap:7px !important;
    align-items:center;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
}

/* Avatar y nombre permanecen visibles. */
body:has(#partida-activa:checked) .registro-overlay .perfil-identidad{
    min-width:0;
    gap:8px;
}

body:has(#partida-activa:checked) .registro-overlay .avatar-preview{
    flex:0 0 auto;
    width:34px !important;
    height:34px !important;
    border-radius:10px !important;
    border-width:1px;
}

body:has(#partida-activa:checked) .registro-overlay .avatar-preview-item{
    font-size:1.45rem !important;
}

body:has(#partida-activa:checked) .registro-overlay .nombre-jugador{
    min-width:0;
}

body:has(#partida-activa:checked) .registro-overlay .nombre-jugador label,
body:has(#partida-activa:checked) .registro-overlay .paso-registro-mini{
    display:none !important;
}

body:has(#partida-activa:checked) .registro-overlay .nombre-jugador input{
    width:100%;
    height:31px;
    min-width:0;
    padding:3px 7px !important;
    border:0 !important;
    border-radius:8px;
    background:rgba(8,23,37,.82) !important;
    box-shadow:none !important;
    color:#eef8ff;
    font-size:.86rem;
    font-weight:800;
    pointer-events:none;
}

/* Engranaje entre identidad y estadísticas. */
body:has(#partida-activa:checked) .registro-overlay .editar-perfil-icon{
    display:grid !important;
    place-items:center;
    width:31px !important;
    height:31px !important;
    margin:0;
    padding:0 !important;
    border:1px solid #355b78;
    border-radius:50%;
    background:#081725;
    color:#dff6ff;
    font-size:.95rem !important;
    box-shadow:none;
    cursor:pointer;
}

/* Estadísticas en una sola línea. */
body:has(#partida-activa:checked) .registro-overlay .hud-compacto{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(75px,1fr)) !important;
    gap:4px !important;
    min-width:0;
}

body:has(#partida-activa:checked) .registro-overlay .hud-mini{
    min-height:0 !important;
    height:34px;
    padding:2px 5px !important;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:4px;
    border:1px solid rgba(49,84,114,.72);
    border-radius:9px;
    background:rgba(8,23,37,.68);
    white-space:nowrap;
}

body:has(#partida-activa:checked) .registro-overlay .hud-mini p{
    margin:0;
    font-size:.58rem;
    letter-spacing:.02em;
}

body:has(#partida-activa:checked) .registro-overlay .hud-mini strong{
    display:inline !important;
    margin:0 !important;
    font-size:.92rem !important;
    line-height:1;
}

body:has(#partida-activa:checked) .registro-overlay .hud-mini>p:last-child{
    display:none;
}

/* Tiempo: mantener solo icono/valor para ganar espacio. */
body:has(#partida-activa:checked) .registro-overlay .timer-state,
body:has(#partida-activa:checked) .registro-overlay .timer-track{
    display:none !important;
}

/* La campaña sigue mostrando progreso, pero como una línea mínima
   pegada al borde inferior del HUD. */
body:has(#partida-activa:checked) .registro-overlay .progreso-hud{
    position:absolute;
    left:0;
    right:0;
    bottom:-3px;
    height:3px;
    padding:0 !important;
    border:0 !important;
    border-radius:0;
    background:#08121d;
    overflow:hidden;
}

body:has(#partida-activa:checked) .registro-overlay .progreso-hud-top{
    display:none !important;
}

body:has(#partida-activa:checked) .registro-overlay .progreso-hud .barra-progreso{
    height:3px;
    border:0;
    border-radius:0;
}

/* Compensación para que el contenido no quede debajo del HUD. */
body:has(#partida-activa:checked) .game-shell{
    padding-top:50px;
}

/* ---------------------------------------------------------
   3. MENÚ SUPERIOR AUTOOCULTO
   El HUD fino siempre queda visible.
   El menú de niveles aparece al llevar el puntero arriba.
   --------------------------------------------------------- */
body:has(#partida-activa:checked) .menu-v8{
    position:fixed !important;
    top:48px !important;
    left:50%;
    z-index:160;
    width:min(1180px,calc(100% - 24px));
    margin:0 !important;
    padding:7px 10px !important;
    border:1px solid #284963;
    border-top:0;
    border-radius:0 0 16px 16px;
    background:rgba(6,16,27,.96);
    backdrop-filter:blur(14px);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translate(-50%,-14px);
    transition:opacity .18s ease,transform .18s ease,visibility .18s ease;
}

/* Hover/foco en la franja superior despliega el menú. */
body:has(#partida-activa:checked):has(.registro-overlay:hover) .menu-v8,
body:has(#partida-activa:checked):has(.registro-overlay:focus-within) .menu-v8,
body:has(#partida-activa:checked) .menu-v8:hover,
body:has(#partida-activa:checked) .menu-v8:focus-within{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translate(-50%,0);
}

/* Reducir también el tamaño de sus botones cuando se despliega. */
body:has(#partida-activa:checked) .menu-v8 a{
    padding:6px 9px;
    font-size:.76rem;
}

/* Flecha superior: adaptada al nuevo HUD fino. */
body:has(#partida-activa:checked) .nav-subir{
    top:62px;
}

/* ---------------------------------------------------------
   Notebook: priorizar que título + video entren juntos
   --------------------------------------------------------- */
@media(max-height:820px) and (min-width:800px){
    .primeros-pasos-v9{
        padding-top:8px;
    }
    
    
    
    
    
}

/* Responsive */
@media(max-width:900px){
    body:has(#partida-activa:checked) .registro-overlay{
        height:50px;
    }
    body:has(#partida-activa:checked) .registro-overlay .perfil-persistente{
        grid-template-columns:minmax(150px,1fr) 32px minmax(330px,1.7fr) !important;
        padding:4px 7px !important;
    }
    body:has(#partida-activa:checked) .registro-overlay .hud-mini p:first-child{
        font-size:0;
    }
    body:has(#partida-activa:checked) .registro-overlay .hud-mini p:first-child::first-letter{
        font-size:.72rem;
    }
}

@media(max-width:680px){
    body:has(#partida-activa:checked) .registro-overlay{
        height:auto;
        min-height:48px !important;
    }
    body:has(#partida-activa:checked) .registro-overlay .perfil-persistente{
        grid-template-columns:minmax(130px,1fr) 32px !important;
        height:auto;
        min-height:47px;
    }
    body:has(#partida-activa:checked) .registro-overlay .hud-compacto{
        grid-column:1/-1;
        grid-template-columns:repeat(4,1fr) !important;
    }
    body:has(#partida-activa:checked) .game-shell{
        padding-top:88px;
    }
    body:has(#partida-activa:checked) .menu-v8{
        top:88px !important;
    }
    
}

/* En dispositivos sin hover, no dejar inaccesible el menú. */
@media(hover:none){
    body:has(#partida-activa:checked) .menu-v8{
        opacity:1;
        visibility:visible;
        pointer-events:auto;
        transform:translate(-50%,0);
    }
}

/* =========================================================
   V11 · Primeros pasos en tres pantallas independientes
   VIDEO → EVIDENCIAS → REGLAS → NIVEL 1
   Sin JavaScript.
   ========================================================= */

/* Primeros pasos se convierte en una experiencia de pantalla completa
   debajo del HUD superior. Cada etapa tiene su propio scroll y comienza arriba. */
body:has(#partida-activa:checked):not(:has(#nivel-1-activo:checked)) .primeros-pasos-v11{
    display:block !important;
    position:fixed;
    top:48px;
    left:0;
    right:0;
    bottom:0;
    z-index:125;
    margin:0 !important;
    padding:0 !important;
    max-width:none !important;
    border:0 !important;
    border-radius:0 !important;
    overflow:hidden;
    background:
        radial-gradient(circle at 50% 0%,rgba(55,216,255,.10),transparent 35%),
        linear-gradient(145deg,#0b1627,#06101b);
}

/* Cada etapa usa su propio contenedor de desplazamiento:
   al aparecer, siempre comienza visualmente desde arriba. */
.primer-paso-screen{
    position:absolute;
    inset:0;
    display:none;
    overflow-y:auto;
    overscroll-behavior:contain;
    background:
        radial-gradient(circle at 50% -10%,rgba(55,216,255,.09),transparent 38%),
        linear-gradient(145deg,#0b1627,#06101b);
}

.primer-paso-video-screen{
    display:block;
}

body:has(#paso-fotos:checked) .primer-paso-video-screen{
    display:none;
}

body:has(#paso-fotos:checked):not(:has(#paso-info:checked)) .primer-paso-fotos-screen{
    display:block;
}

body:has(#paso-info:checked) .primer-paso-video-screen,
body:has(#paso-info:checked) .primer-paso-fotos-screen{
    display:none;
}

body:has(#paso-info:checked) .primer-paso-info-screen{
    display:block;
}

.primer-paso-inner{
    width:min(1180px,calc(100% - 34px));
    min-height:100%;
    margin:0 auto;
    padding:22px 0 32px;
}

.primer-paso-title{
    max-width:900px;
    margin:0 auto 16px;
    text-align:center;
}

.primer-paso-title h2{
    margin:4px 0 8px;
    color:#fff;
    font-size:clamp(1.8rem,3.4vw,3.25rem);
    line-height:1.08;
}

.primer-paso-title>p:last-child{
    margin:0;
    color:var(--muted);
}

/* Indicador 1 → 2 → 3 */
.stage-progress{
    display:flex;
    align-items:center;
    justify-content:center;
    width:min(380px,90%);
    margin:0 auto 14px;
}

.stage-dot{
    flex:0 0 auto;
    display:grid;
    place-items:center;
    width:32px;
    height:32px;
    border:1px solid #3a5d77;
    border-radius:50%;
    background:#0b1d2d;
    color:#7893a7;
    font-size:.78rem;
    font-weight:900;
}

.stage-dot.active{
    border-color:var(--cyan);
    background:var(--cyan);
    color:#06111c;
    box-shadow:0 0 20px rgba(55,216,255,.25);
}

.stage-dot.complete{
    border-color:var(--green);
    background:var(--green);
    color:#04150c;
}

.stage-line{
    width:75px;
    height:2px;
    background:#2d4b61;
}

.stage-line.complete{
    background:var(--green);
}

/* ---------------------------------------------------------
   Pantalla 1: video
   --------------------------------------------------------- */
.primer-paso-video-inner{
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
}

.video-stage-card{
    width:min(920px,100%);
    margin:0 auto;
    padding:8px;
    border:1px solid rgba(55,216,255,.28);
    border-radius:20px;
    background:#050d16;
    box-shadow:0 20px 60px rgba(0,0,0,.26);
}

.video-stage-card iframe{
    display:block;
    width:100%;
    aspect-ratio:16/9;
    border:0;
    border-radius:13px;
    background:#000;
}

.stage-bottom-copy{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    width:min(920px,100%);
    margin:12px auto 0;
    padding:0 4px;
    color:var(--muted);
    font-size:.9rem;
}

.stage-bottom-copy p{
    margin:0;
}

.stage-bottom-copy .link-video{
    flex:0 0 auto;
}

.stage-action{
    display:flex;
    justify-content:center;
    margin:20px 0 0;
    padding-bottom:8px;
}

.stage-next-button{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    min-width:min(410px,100%);
    min-height:52px;
    padding:12px 22px;
    border:2px solid var(--cyan);
    border-radius:14px;
    background:linear-gradient(135deg,#113954,#0b263b);
    color:#fff;
    box-shadow:0 12px 30px rgba(0,0,0,.25),0 0 25px rgba(55,216,255,.10);
    cursor:pointer;
    font-size:.88rem;
    font-weight:900;
    letter-spacing:.04em;
    text-align:center;
    transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}

.stage-next-button span{
    font-size:1.25rem;
    line-height:1;
}

.stage-next-button:hover{
    transform:translateY(-2px);
    border-color:#fff;
    box-shadow:0 15px 36px rgba(0,0,0,.32),0 0 30px rgba(55,216,255,.22);
}

/* ---------------------------------------------------------
   Pantalla 2: evidencias
   --------------------------------------------------------- */
.evidence-screen-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
    margin:18px 0;
}

.evidence-card-v11{
    overflow:hidden;
    border:1px solid #31556f;
    border-radius:20px;
    background:#081827;
}

.evidence-card-v11 img{
    display:block;
    width:100%;
    height:auto;
    aspect-ratio:3/2;
    object-fit:contain;
    background:#eef2f5;
}

.evidence-card-v11>div{
    padding:14px 16px 16px;
}

.evidence-card-v11 span{
    color:var(--cyan);
    font-size:.7rem;
    font-weight:900;
    letter-spacing:.12em;
}

.evidence-card-v11 p{
    margin:6px 0 0;
    color:#e8f5ff;
}

.evidence-question-v11{
    display:flex;
    align-items:center;
    gap:14px;
    max-width:850px;
    margin:18px auto 0;
    padding:15px 18px;
    border:1px solid rgba(255,215,101,.44);
    border-radius:15px;
    background:rgba(255,215,101,.06);
}

.evidence-question-v11>span{
    font-size:1.8rem;
}

.evidence-question-v11 p{
    margin:0;
}

/* ---------------------------------------------------------
   Pantalla 3: reglas
   --------------------------------------------------------- */
.primer-paso-info-inner{
    padding-bottom:38px;
}

.reglas-v11-grid{
    margin-top:18px;
}

.mapa-v11{
    margin-top:22px;
}

.start-level-v11{
    display:flex;
    width:min(430px,100%);
    min-height:54px;
    margin:26px auto 10px;
    align-items:center;
    justify-content:center;
    cursor:pointer;
}

/* ---------------------------------------------------------
   BYTE cambia según la pantalla de Primeros pasos
   --------------------------------------------------------- */
.byte-v8 .help-paso-video,
.byte-v8 .help-paso-fotos,
.byte-v8 .help-paso-info{
    display:none;
}

body:has(#partida-activa:checked):not(:has(#paso-fotos:checked)):not(:has(#nivel-1-activo:checked)) .help-paso-video{
    display:block;
}

body:has(#paso-fotos:checked):not(:has(#paso-info:checked)):not(:has(#nivel-1-activo:checked)) .help-paso-fotos{
    display:block;
}

body:has(#paso-info:checked):not(:has(#nivel-1-activo:checked)) .help-paso-info{
    display:block;
}

/* Evitar que reglas antiguas de Primeros pasos muestren ayudas duplicadas. */

/* Durante las tres pantallas de introducción se usan los botones grandes
   internos, no la flecha flotante inferior. */
body:has(#partida-activa:checked):not(:has(#nivel-1-activo:checked)) .nav-bajar{
    display:none !important;
}

/* La flecha superior tampoco distrae durante el briefing inicial. */

/* ---------------------------------------------------------
   Notebook: título + video + botón deben entrar de forma natural.
   --------------------------------------------------------- */
@media(max-height:820px) and (min-width:760px){
    .primer-paso-inner{
        padding-top:12px;
    }

    .stage-progress{
        margin-bottom:7px;
    }

    .primer-paso-title{
        margin-bottom:8px;
    }

    .primer-paso-title h2{
        font-size:clamp(1.45rem,2.5vw,2.1rem);
        margin-top:1px;
    }

    .video-stage-card{
        width:min(760px,100%);
        padding:6px;
    }

    .stage-bottom-copy{
        width:min(760px,100%);
        margin-top:7px;
        font-size:.8rem;
    }

    .stage-action{
        margin-top:10px;
    }

    .stage-next-button{
        min-height:46px;
        padding:9px 18px;
    }
}

@media(max-width:760px){
    .primer-paso-inner{
        width:min(100% - 20px,1180px);
        padding-top:16px;
    }

    .evidence-screen-grid{
        grid-template-columns:1fr;
    }

    .stage-bottom-copy{
        align-items:flex-start;
        flex-direction:column;
        gap:8px;
    }

    .stage-next-button{
        min-width:100%;
    }
}

/* =========================================================
   V12 · VIDAS ACUMULATIVAS + NIVELES PANTALLA + CERTIFICADO
   HTML + CSS únicamente.
   ========================================================= */

.game-state-form{
    margin:0;
    padding:0;
}

/* ---------------------------------------------------------
   1. VIDAS ACUMULATIVAS PARA TODA LA CAMPAÑA
   --------------------------------------------------------- */
.vidas-valor::after{content:"5" !important}
body:has(#loss-1:checked) .vidas-valor::after{content:"4" !important}
body:has(#loss-2:checked) .vidas-valor::after{content:"3" !important}
body:has(#loss-3:checked) .vidas-valor::after{content:"2" !important}
body:has(#loss-4:checked) .vidas-valor::after{content:"1" !important}
body:has(#loss-5:checked) .vidas-valor::after{content:"0" !important}

/* Cada error activa únicamente la siguiente vida disponible. */

/* Al llegar a cero, Game Over inmediato. */
.game-over-v12{display:none !important}
body:has(#loss-5:checked) .game-over-v12{display:grid !important}

.game-over-v12{
    z-index:400 !important;
}
.profile-preserved{
    display:flex;
    align-items:center;
    gap:10px;
    max-width:430px;
    margin:18px auto 0;
    padding:13px 15px;
    border:1px solid rgba(64,227,140,.42);
    border-radius:14px;
    background:rgba(64,227,140,.07);
    text-align:left;
}
.profile-preserved span{
    display:grid;
    place-items:center;
    width:30px;height:30px;
    border-radius:50%;
    background:var(--green);
    color:#06150d;
    font-weight:900;
}
.profile-preserved p{margin:0}
.restart-button{
    border:0;
    cursor:pointer;
    font:inherit;
}

/* Si se reinicia el game-state, vuelven Video → Evidencias → Reglas,
   pero partida-activa y el perfil permanecen fuera del formulario. */
body:has(#partida-activa:checked):not(:has(#nivel-1-activo:checked)) .resource-panel{
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
}

/* ---------------------------------------------------------
   2. PUNTAJE CONGELADO AL SUPERAR CADA NIVEL
   --------------------------------------------------------- */
body{
    --p1:0;--p2:0;--p3:0;--p4:0;--p5:0;
    --gems:"0";
    --progress:"0%";
    --progress-width:0%;
}

body:has(#l1-win-100:checked){--p1:100}
body:has(#l1-win-100:checked) .score-l1::after{content:"100 puntos"}
body:has(#l1-win-100:checked) .cert-score-l1::after{content:"100"}
body:has(#l1-win-50:checked){--p1:50}
body:has(#l1-win-50:checked) .score-l1::after{content:"50 puntos"}
body:has(#l1-win-50:checked) .cert-score-l1::after{content:"50"}
body:has(#l1-win-25:checked){--p1:25}
body:has(#l1-win-25:checked) .score-l1::after{content:"25 puntos"}
body:has(#l1-win-25:checked) .cert-score-l1::after{content:"25"}
body:has(#l1-win-10:checked){--p1:10}
body:has(#l1-win-10:checked) .score-l1::after{content:"10 puntos"}
body:has(#l1-win-10:checked) .cert-score-l1::after{content:"10"}
body:has(#l1-win-0:checked){--p1:0}
body:has(#l1-win-0:checked) .score-l1::after{content:"0 puntos"}
body:has(#l1-win-0:checked) .cert-score-l1::after{content:"0"}
body:has(#l2-win-100:checked){--p2:100}
body:has(#l2-win-100:checked) .score-l2::after{content:"100 puntos"}
body:has(#l2-win-100:checked) .cert-score-l2::after{content:"100"}
body:has(#l2-win-50:checked){--p2:50}
body:has(#l2-win-50:checked) .score-l2::after{content:"50 puntos"}
body:has(#l2-win-50:checked) .cert-score-l2::after{content:"50"}
body:has(#l2-win-25:checked){--p2:25}
body:has(#l2-win-25:checked) .score-l2::after{content:"25 puntos"}
body:has(#l2-win-25:checked) .cert-score-l2::after{content:"25"}
body:has(#l2-win-10:checked){--p2:10}
body:has(#l2-win-10:checked) .score-l2::after{content:"10 puntos"}
body:has(#l2-win-10:checked) .cert-score-l2::after{content:"10"}
body:has(#l2-win-0:checked){--p2:0}
body:has(#l2-win-0:checked) .score-l2::after{content:"0 puntos"}
body:has(#l2-win-0:checked) .cert-score-l2::after{content:"0"}
body:has(#l3-win-100:checked){--p3:100}
body:has(#l3-win-100:checked) .score-l3::after{content:"100 puntos"}
body:has(#l3-win-100:checked) .cert-score-l3::after{content:"100"}
body:has(#l3-win-50:checked){--p3:50}
body:has(#l3-win-50:checked) .score-l3::after{content:"50 puntos"}
body:has(#l3-win-50:checked) .cert-score-l3::after{content:"50"}
body:has(#l3-win-25:checked){--p3:25}
body:has(#l3-win-25:checked) .score-l3::after{content:"25 puntos"}
body:has(#l3-win-25:checked) .cert-score-l3::after{content:"25"}
body:has(#l3-win-10:checked){--p3:10}
body:has(#l3-win-10:checked) .score-l3::after{content:"10 puntos"}
body:has(#l3-win-10:checked) .cert-score-l3::after{content:"10"}
body:has(#l3-win-0:checked){--p3:0}
body:has(#l3-win-0:checked) .score-l3::after{content:"0 puntos"}
body:has(#l3-win-0:checked) .cert-score-l3::after{content:"0"}
body:has(#l4-win-100:checked){--p4:100}
body:has(#l4-win-100:checked) .score-l4::after{content:"100 puntos"}
body:has(#l4-win-100:checked) .cert-score-l4::after{content:"100"}
body:has(#l4-win-50:checked){--p4:50}
body:has(#l4-win-50:checked) .score-l4::after{content:"50 puntos"}
body:has(#l4-win-50:checked) .cert-score-l4::after{content:"50"}
body:has(#l4-win-25:checked){--p4:25}
body:has(#l4-win-25:checked) .score-l4::after{content:"25 puntos"}
body:has(#l4-win-25:checked) .cert-score-l4::after{content:"25"}
body:has(#l4-win-10:checked){--p4:10}
body:has(#l4-win-10:checked) .score-l4::after{content:"10 puntos"}
body:has(#l4-win-10:checked) .cert-score-l4::after{content:"10"}
body:has(#l4-win-0:checked){--p4:0}
body:has(#l4-win-0:checked) .score-l4::after{content:"0 puntos"}
body:has(#l4-win-0:checked) .cert-score-l4::after{content:"0"}
body:has(#l5-win-100:checked){--p5:100}
body:has(#l5-win-100:checked) .score-l5::after{content:"100 puntos"}
body:has(#l5-win-100:checked) .cert-score-l5::after{content:"100"}
body:has(#l5-win-50:checked){--p5:50}
body:has(#l5-win-50:checked) .score-l5::after{content:"50 puntos"}
body:has(#l5-win-50:checked) .cert-score-l5::after{content:"50"}
body:has(#l5-win-25:checked){--p5:25}
body:has(#l5-win-25:checked) .score-l5::after{content:"25 puntos"}
body:has(#l5-win-25:checked) .cert-score-l5::after{content:"25"}
body:has(#l5-win-10:checked){--p5:10}
body:has(#l5-win-10:checked) .score-l5::after{content:"10 puntos"}
body:has(#l5-win-10:checked) .cert-score-l5::after{content:"10"}
body:has(#l5-win-0:checked){--p5:0}
body:has(#l5-win-0:checked) .score-l5::after{content:"0 puntos"}
body:has(#l5-win-0:checked) .cert-score-l5::after{content:"0"}

.puntaje-valor{
    counter-reset:puntos-v12 calc(var(--p1) + var(--p2) + var(--p3) + var(--p4) + var(--p5)) !important;
}
.puntaje-valor::after{content:counter(puntos-v12) !important}

/* Progreso y gemas: un nivel superado = una gema + 20%. */
body:has(input[name="l1-win"]:checked){--gems:"1";--progress:"20%";--progress-width:20%}
body:has(input[name="l2-win"]:checked){--gems:"2";--progress:"40%";--progress-width:40%}
body:has(input[name="l3-win"]:checked){--gems:"3";--progress:"60%";--progress-width:60%}
body:has(input[name="l4-win"]:checked){--gems:"4";--progress:"80%";--progress-width:80%}
body:has(input[name="l5-win"]:checked){--gems:"5";--progress:"100%";--progress-width:100%}

/* ---------------------------------------------------------
   3. MENÚ = INDICADOR DE PROGRESO, NO ATAJO
   --------------------------------------------------------- */
.menu-v8 .menu-level{
    pointer-events:none !important;
}
.menu-status-home{
    padding:6px 10px;
    border:1px solid #355773;
    border-radius:10px;
    color:#bcd0df;
    background:#081827;
    font-size:.76rem;
    font-weight:800;
}

body:has(input[name="l1-win"]:checked) .menu-l1,
body:has(input[name="l2-win"]:checked) .menu-l2,
body:has(input[name="l3-win"]:checked) .menu-l3,
body:has(input[name="l4-win"]:checked) .menu-l4,
body:has(input[name="l5-win"]:checked) .menu-l5{
    border-color:var(--green) !important;
    color:#dfffee !important;
    opacity:1 !important;
}
body:has(input[name="l1-win"]:checked) .menu-l1 span,
body:has(input[name="l2-win"]:checked) .menu-l2 span,
body:has(input[name="l3-win"]:checked) .menu-l3 span,
body:has(input[name="l4-win"]:checked) .menu-l4 span,
body:has(input[name="l5-win"]:checked) .menu-l5 span{
    background:var(--green) !important;
    color:#05150c !important;
    font-size:0 !important;
}
body:has(input[name="l1-win"]:checked) .menu-l1 span::after,
body:has(input[name="l2-win"]:checked) .menu-l2 span::after,
body:has(input[name="l3-win"]:checked) .menu-l3 span::after,
body:has(input[name="l4-win"]:checked) .menu-l4 span::after,
body:has(input[name="l5-win"]:checked) .menu-l5 span::after{
    content:"✓";
    font-size:.82rem;
}

/* ---------------------------------------------------------
   4. CADA NIVEL ES UNA PANTALLA CLARAMENTE DIFERENCIADA
   --------------------------------------------------------- */
.campania-v12{
    display:block !important;
}

.level-stage-v12{
    position:fixed;
    top:48px;
    left:0;
    right:0;
    bottom:0;
    z-index:122;
    display:none !important;
    overflow:hidden;
    background:
        radial-gradient(circle at 16% 8%,color-mix(in srgb,var(--level-accent) 13%,transparent),transparent 30%),
        radial-gradient(circle at 90% 70%,color-mix(in srgb,var(--level-accent) 7%,transparent),transparent 25%),
        linear-gradient(145deg,#07131f,#0a1927 58%,#06101a);
}

.level-stage-scroll{
    position:relative;
    height:100%;
    overflow-y:auto;
    overscroll-behavior:contain;
    padding:28px max(18px,calc((100vw - 1120px)/2)) 54px;
}

.accent-cyan{--level-accent:#37d8ff}
.accent-purple{--level-accent:#8e6cff}
.accent-gold{--level-accent:#ffd765}
.accent-pink{--level-accent:#ff53b2}
.accent-green{--level-accent:#40e38c}

.level-watermark{
    position:absolute;
    top:14px;
    right:max(22px,calc((100vw - 1120px)/2));
    z-index:-1;
    color:color-mix(in srgb,var(--level-accent) 10%,transparent);
    font-size:clamp(8rem,18vw,15rem);
    font-weight:1000;
    line-height:.8;
    letter-spacing:-.08em;
    user-select:none;
}

.level-hero-v12{
    position:relative;
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    gap:22px;
    align-items:center;
    min-height:165px;
    margin-bottom:18px;
    padding:25px;
    border:1px solid color-mix(in srgb,var(--level-accent) 42%,#27465f);
    border-radius:26px;
    background:
        linear-gradient(125deg,color-mix(in srgb,var(--level-accent) 9%,#081725),#081725 48%,#07131e);
    box-shadow:0 22px 65px rgba(0,0,0,.25),inset 4px 0 0 var(--level-accent);
}

.level-hero-v12 h2{
    margin:3px 0 8px;
    color:#fff;
    font-size:clamp(2rem,4vw,3.7rem);
    line-height:1;
}

.level-hero-v12>div:nth-child(2)>p:last-child{
    margin:0;
    color:var(--muted);
}

.level-rank-v12{
    display:grid;
    place-items:center;
    min-width:95px;
    min-height:95px;
    padding:12px;
    border:1px solid color-mix(in srgb,var(--level-accent) 52%,#38546b);
    border-radius:20px;
    background:#071522;
    text-align:center;
}
.level-rank-v12 span{
    color:var(--level-accent);
    font-size:.68rem;
    font-weight:900;
    letter-spacing:.1em;
}
.level-rank-v12 strong{
    color:#fff;
    font-size:.84rem;
}

.level-life-status{
    min-width:150px;
    padding:13px;
    border:1px solid #35546d;
    border-radius:16px;
    background:rgba(5,17,28,.75);
    text-align:center;
}
.level-life-status small{
    display:block;
    color:var(--muted);
    font-size:.62rem;
    font-weight:900;
    letter-spacing:.08em;
}
.level-life-status strong{
    display:block;
    margin-top:4px;
    color:#fff;
    font-size:1.15rem;
}

.level-flow-v12{
    display:flex;
    gap:8px;
    margin:0 0 18px;
}
.level-flow-v12 span{
    flex:1;
    padding:9px 12px;
    border:1px solid #294a63;
    border-radius:11px;
    color:#7896aa;
    background:#071624;
    text-align:center;
    font-size:.7rem;
    font-weight:900;
    letter-spacing:.05em;
}
.level-flow-v12 .active{
    border-color:var(--level-accent);
    color:#fff;
    box-shadow:inset 0 -2px 0 var(--level-accent);
}

.level-training-v12,
.level-case-v12,
.level-challenge-v12{
    border-color:color-mix(in srgb,var(--level-accent) 27%,#2e4d65) !important;
}
.level-training-v12 .material-icono{
    filter:drop-shadow(0 0 15px color-mix(in srgb,var(--level-accent) 40%,transparent));
}

.answer-slot{
    display:contents;
}
.correct-layer{display:none !important}

/* Nivel visible = solo el nivel actualmente activado.
   El siguiente NO aparece hasta pulsar su botón de ascenso. */
body:has(#nivel-1-activo:checked):not(:has(input[name="l2-start"]:checked)) #nivel-1{
    display:block !important;
}
body:has(input[name="l2-start"]:checked):not(:has(input[name="l3-start"]:checked)) #nivel-2{
    display:block !important;
}
body:has(input[name="l3-start"]:checked):not(:has(input[name="l4-start"]:checked)) #nivel-3{
    display:block !important;
}
body:has(input[name="l4-start"]:checked):not(:has(input[name="l5-start"]:checked)) #nivel-4{
    display:block !important;
}
body:has(input[name="l5-start"]:checked):not(:has(input[name="l5-win"]:checked)) #nivel-5{
    display:block !important;
}

/* ---------------------------------------------------------
   5. INTENTOS Y RESPUESTA CORRECTA SEGÚN LAS VIDAS CON LAS QUE
      SE ENTRÓ AL NIVEL
   --------------------------------------------------------- */
.attempt-dynamic::after{content:"1"}
.reward-dynamic::after{content:"100 puntos"}

.correct-layer{
    align-items:center;
    gap:12px;
}

/* Nivel 1 siempre comienza con 0 errores acumulados. */
body:not(:has(#loss-1:checked)) .correct-l1-100{display:flex !important}
body:has(#loss-1:checked):not(:has(#loss-2:checked)) .correct-l1-50{display:flex !important}
body:has(#loss-2:checked):not(:has(#loss-3:checked)) .correct-l1-25{display:flex !important}
body:has(#loss-3:checked):not(:has(#loss-4:checked)) .correct-l1-10{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)) .correct-l1-0{display:flex !important}

body:has(#loss-1:checked):not(:has(#loss-2:checked)) .attempt-l1::after{content:"2"}
body:has(#loss-2:checked):not(:has(#loss-3:checked)) .attempt-l1::after{content:"3"}
body:has(#loss-3:checked):not(:has(#loss-4:checked)) .attempt-l1::after{content:"4"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)) .attempt-l1::after{content:"5"}
body:has(#loss-1:checked):not(:has(#loss-2:checked)) .reward-l1::after{content:"50 puntos"}
body:has(#loss-2:checked):not(:has(#loss-3:checked)) .reward-l1::after{content:"25 puntos"}
body:has(#loss-3:checked):not(:has(#loss-4:checked)) .reward-l1::after{content:"10 puntos"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)) .reward-l1::after{content:"0 puntos"}

body:not(:has(#loss-1:checked)):has(#l2-start-0:checked) .correct-l2-100{display:flex !important}
body:not(:has(#loss-1:checked)):has(#l2-start-0:checked) .attempt-l2::after{content:"1"}
body:not(:has(#loss-1:checked)):has(#l2-start-0:checked) .reward-l2::after{content:"100 puntos"}

body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l2-start-0:checked) .correct-l2-50{display:flex !important}
body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l2-start-0:checked) .attempt-l2::after{content:"2"}
body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l2-start-0:checked) .reward-l2::after{content:"50 puntos"}

body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l2-start-0:checked) .correct-l2-25{display:flex !important}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l2-start-0:checked) .attempt-l2::after{content:"3"}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l2-start-0:checked) .reward-l2::after{content:"25 puntos"}

body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l2-start-0:checked) .correct-l2-10{display:flex !important}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l2-start-0:checked) .attempt-l2::after{content:"4"}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l2-start-0:checked) .reward-l2::after{content:"10 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l2-start-0:checked) .correct-l2-0{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l2-start-0:checked) .attempt-l2::after{content:"5"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l2-start-0:checked) .reward-l2::after{content:"0 puntos"}

body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l2-start-1:checked) .correct-l2-100{display:flex !important}
body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l2-start-1:checked) .attempt-l2::after{content:"1"}
body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l2-start-1:checked) .reward-l2::after{content:"100 puntos"}

body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l2-start-1:checked) .correct-l2-50{display:flex !important}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l2-start-1:checked) .attempt-l2::after{content:"2"}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l2-start-1:checked) .reward-l2::after{content:"50 puntos"}

body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l2-start-1:checked) .correct-l2-25{display:flex !important}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l2-start-1:checked) .attempt-l2::after{content:"3"}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l2-start-1:checked) .reward-l2::after{content:"25 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l2-start-1:checked) .correct-l2-10{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l2-start-1:checked) .attempt-l2::after{content:"4"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l2-start-1:checked) .reward-l2::after{content:"10 puntos"}

body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l2-start-2:checked) .correct-l2-100{display:flex !important}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l2-start-2:checked) .attempt-l2::after{content:"1"}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l2-start-2:checked) .reward-l2::after{content:"100 puntos"}

body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l2-start-2:checked) .correct-l2-50{display:flex !important}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l2-start-2:checked) .attempt-l2::after{content:"2"}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l2-start-2:checked) .reward-l2::after{content:"50 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l2-start-2:checked) .correct-l2-25{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l2-start-2:checked) .attempt-l2::after{content:"3"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l2-start-2:checked) .reward-l2::after{content:"25 puntos"}

body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l2-start-3:checked) .correct-l2-100{display:flex !important}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l2-start-3:checked) .attempt-l2::after{content:"1"}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l2-start-3:checked) .reward-l2::after{content:"100 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l2-start-3:checked) .correct-l2-50{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l2-start-3:checked) .attempt-l2::after{content:"2"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l2-start-3:checked) .reward-l2::after{content:"50 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l2-start-4:checked) .correct-l2-100{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l2-start-4:checked) .attempt-l2::after{content:"1"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l2-start-4:checked) .reward-l2::after{content:"100 puntos"}

body:not(:has(#loss-1:checked)):has(#l3-start-0:checked) .correct-l3-100{display:flex !important}
body:not(:has(#loss-1:checked)):has(#l3-start-0:checked) .attempt-l3::after{content:"1"}
body:not(:has(#loss-1:checked)):has(#l3-start-0:checked) .reward-l3::after{content:"100 puntos"}

body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l3-start-0:checked) .correct-l3-50{display:flex !important}
body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l3-start-0:checked) .attempt-l3::after{content:"2"}
body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l3-start-0:checked) .reward-l3::after{content:"50 puntos"}

body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l3-start-0:checked) .correct-l3-25{display:flex !important}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l3-start-0:checked) .attempt-l3::after{content:"3"}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l3-start-0:checked) .reward-l3::after{content:"25 puntos"}

body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l3-start-0:checked) .correct-l3-10{display:flex !important}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l3-start-0:checked) .attempt-l3::after{content:"4"}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l3-start-0:checked) .reward-l3::after{content:"10 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l3-start-0:checked) .correct-l3-0{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l3-start-0:checked) .attempt-l3::after{content:"5"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l3-start-0:checked) .reward-l3::after{content:"0 puntos"}

body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l3-start-1:checked) .correct-l3-100{display:flex !important}
body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l3-start-1:checked) .attempt-l3::after{content:"1"}
body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l3-start-1:checked) .reward-l3::after{content:"100 puntos"}

body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l3-start-1:checked) .correct-l3-50{display:flex !important}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l3-start-1:checked) .attempt-l3::after{content:"2"}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l3-start-1:checked) .reward-l3::after{content:"50 puntos"}

body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l3-start-1:checked) .correct-l3-25{display:flex !important}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l3-start-1:checked) .attempt-l3::after{content:"3"}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l3-start-1:checked) .reward-l3::after{content:"25 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l3-start-1:checked) .correct-l3-10{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l3-start-1:checked) .attempt-l3::after{content:"4"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l3-start-1:checked) .reward-l3::after{content:"10 puntos"}

body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l3-start-2:checked) .correct-l3-100{display:flex !important}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l3-start-2:checked) .attempt-l3::after{content:"1"}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l3-start-2:checked) .reward-l3::after{content:"100 puntos"}

body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l3-start-2:checked) .correct-l3-50{display:flex !important}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l3-start-2:checked) .attempt-l3::after{content:"2"}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l3-start-2:checked) .reward-l3::after{content:"50 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l3-start-2:checked) .correct-l3-25{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l3-start-2:checked) .attempt-l3::after{content:"3"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l3-start-2:checked) .reward-l3::after{content:"25 puntos"}

body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l3-start-3:checked) .correct-l3-100{display:flex !important}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l3-start-3:checked) .attempt-l3::after{content:"1"}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l3-start-3:checked) .reward-l3::after{content:"100 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l3-start-3:checked) .correct-l3-50{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l3-start-3:checked) .attempt-l3::after{content:"2"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l3-start-3:checked) .reward-l3::after{content:"50 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l3-start-4:checked) .correct-l3-100{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l3-start-4:checked) .attempt-l3::after{content:"1"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l3-start-4:checked) .reward-l3::after{content:"100 puntos"}

body:not(:has(#loss-1:checked)):has(#l4-start-0:checked) .correct-l4-100{display:flex !important}
body:not(:has(#loss-1:checked)):has(#l4-start-0:checked) .attempt-l4::after{content:"1"}
body:not(:has(#loss-1:checked)):has(#l4-start-0:checked) .reward-l4::after{content:"100 puntos"}

body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l4-start-0:checked) .correct-l4-50{display:flex !important}
body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l4-start-0:checked) .attempt-l4::after{content:"2"}
body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l4-start-0:checked) .reward-l4::after{content:"50 puntos"}

body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l4-start-0:checked) .correct-l4-25{display:flex !important}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l4-start-0:checked) .attempt-l4::after{content:"3"}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l4-start-0:checked) .reward-l4::after{content:"25 puntos"}

body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l4-start-0:checked) .correct-l4-10{display:flex !important}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l4-start-0:checked) .attempt-l4::after{content:"4"}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l4-start-0:checked) .reward-l4::after{content:"10 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l4-start-0:checked) .correct-l4-0{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l4-start-0:checked) .attempt-l4::after{content:"5"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l4-start-0:checked) .reward-l4::after{content:"0 puntos"}

body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l4-start-1:checked) .correct-l4-100{display:flex !important}
body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l4-start-1:checked) .attempt-l4::after{content:"1"}
body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l4-start-1:checked) .reward-l4::after{content:"100 puntos"}

body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l4-start-1:checked) .correct-l4-50{display:flex !important}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l4-start-1:checked) .attempt-l4::after{content:"2"}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l4-start-1:checked) .reward-l4::after{content:"50 puntos"}

body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l4-start-1:checked) .correct-l4-25{display:flex !important}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l4-start-1:checked) .attempt-l4::after{content:"3"}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l4-start-1:checked) .reward-l4::after{content:"25 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l4-start-1:checked) .correct-l4-10{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l4-start-1:checked) .attempt-l4::after{content:"4"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l4-start-1:checked) .reward-l4::after{content:"10 puntos"}

body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l4-start-2:checked) .correct-l4-100{display:flex !important}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l4-start-2:checked) .attempt-l4::after{content:"1"}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l4-start-2:checked) .reward-l4::after{content:"100 puntos"}

body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l4-start-2:checked) .correct-l4-50{display:flex !important}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l4-start-2:checked) .attempt-l4::after{content:"2"}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l4-start-2:checked) .reward-l4::after{content:"50 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l4-start-2:checked) .correct-l4-25{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l4-start-2:checked) .attempt-l4::after{content:"3"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l4-start-2:checked) .reward-l4::after{content:"25 puntos"}

body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l4-start-3:checked) .correct-l4-100{display:flex !important}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l4-start-3:checked) .attempt-l4::after{content:"1"}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l4-start-3:checked) .reward-l4::after{content:"100 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l4-start-3:checked) .correct-l4-50{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l4-start-3:checked) .attempt-l4::after{content:"2"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l4-start-3:checked) .reward-l4::after{content:"50 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l4-start-4:checked) .correct-l4-100{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l4-start-4:checked) .attempt-l4::after{content:"1"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l4-start-4:checked) .reward-l4::after{content:"100 puntos"}

body:not(:has(#loss-1:checked)):has(#l5-start-0:checked) .correct-l5-100{display:flex !important}
body:not(:has(#loss-1:checked)):has(#l5-start-0:checked) .attempt-l5::after{content:"1"}
body:not(:has(#loss-1:checked)):has(#l5-start-0:checked) .reward-l5::after{content:"100 puntos"}

body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l5-start-0:checked) .correct-l5-50{display:flex !important}
body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l5-start-0:checked) .attempt-l5::after{content:"2"}
body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l5-start-0:checked) .reward-l5::after{content:"50 puntos"}

body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l5-start-0:checked) .correct-l5-25{display:flex !important}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l5-start-0:checked) .attempt-l5::after{content:"3"}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l5-start-0:checked) .reward-l5::after{content:"25 puntos"}

body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l5-start-0:checked) .correct-l5-10{display:flex !important}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l5-start-0:checked) .attempt-l5::after{content:"4"}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l5-start-0:checked) .reward-l5::after{content:"10 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l5-start-0:checked) .correct-l5-0{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l5-start-0:checked) .attempt-l5::after{content:"5"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l5-start-0:checked) .reward-l5::after{content:"0 puntos"}

body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l5-start-1:checked) .correct-l5-100{display:flex !important}
body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l5-start-1:checked) .attempt-l5::after{content:"1"}
body:has(#loss-1:checked):not(:has(#loss-2:checked)):has(#l5-start-1:checked) .reward-l5::after{content:"100 puntos"}

body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l5-start-1:checked) .correct-l5-50{display:flex !important}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l5-start-1:checked) .attempt-l5::after{content:"2"}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l5-start-1:checked) .reward-l5::after{content:"50 puntos"}

body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l5-start-1:checked) .correct-l5-25{display:flex !important}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l5-start-1:checked) .attempt-l5::after{content:"3"}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l5-start-1:checked) .reward-l5::after{content:"25 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l5-start-1:checked) .correct-l5-10{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l5-start-1:checked) .attempt-l5::after{content:"4"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l5-start-1:checked) .reward-l5::after{content:"10 puntos"}

body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l5-start-2:checked) .correct-l5-100{display:flex !important}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l5-start-2:checked) .attempt-l5::after{content:"1"}
body:has(#loss-2:checked):not(:has(#loss-3:checked)):has(#l5-start-2:checked) .reward-l5::after{content:"100 puntos"}

body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l5-start-2:checked) .correct-l5-50{display:flex !important}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l5-start-2:checked) .attempt-l5::after{content:"2"}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l5-start-2:checked) .reward-l5::after{content:"50 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l5-start-2:checked) .correct-l5-25{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l5-start-2:checked) .attempt-l5::after{content:"3"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l5-start-2:checked) .reward-l5::after{content:"25 puntos"}

body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l5-start-3:checked) .correct-l5-100{display:flex !important}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l5-start-3:checked) .attempt-l5::after{content:"1"}
body:has(#loss-3:checked):not(:has(#loss-4:checked)):has(#l5-start-3:checked) .reward-l5::after{content:"100 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l5-start-3:checked) .correct-l5-50{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l5-start-3:checked) .attempt-l5::after{content:"2"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l5-start-3:checked) .reward-l5::after{content:"50 puntos"}

body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l5-start-4:checked) .correct-l5-100{display:flex !important}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l5-start-4:checked) .attempt-l5::after{content:"1"}
body:has(#loss-4:checked):not(:has(#loss-5:checked)):has(#l5-start-4:checked) .reward-l5::after{content:"100 puntos"}

/* ---------------------------------------------------------
   6. FEEDBACK DE ERROR SOLO SI EL ERROR OCURRIÓ EN ESE NIVEL
   --------------------------------------------------------- */

/* Nivel 1: cualquier pérdida antes de acertar pertenece al nivel 1. */

/* Éxito y bloqueo de opciones. */
body:has(input[name="l1-win"]:checked) .feedback-l1-bien,
body:has(input[name="l2-win"]:checked) .feedback-l2-bien,
body:has(input[name="l3-win"]:checked) .feedback-l3-bien,
body:has(input[name="l4-win"]:checked) .feedback-l4-bien,
body:has(input[name="l5-win"]:checked) .feedback-l5-bien{
    display:block !important;
}

body:has(input[name="l1-win"]:checked) .opciones-l1 .opcion,
body:has(input[name="l2-win"]:checked) .opciones-l2 .opcion,
body:has(input[name="l3-win"]:checked) .opciones-l3 .opcion,
body:has(input[name="l4-win"]:checked) .opciones-l4 .opcion,
body:has(input[name="l5-win"]:checked) .opciones-l5 .opcion{
    pointer-events:none;
}

.level-complete-v12{
    position:relative;
    margin-top:22px;
    padding:24px !important;
    border:1px solid rgba(64,227,140,.55) !important;
    border-radius:20px !important;
    background:
        radial-gradient(circle at 5% 0%,rgba(64,227,140,.14),transparent 35%),
        #071b16 !important;
    text-align:center;
}
.completion-check{
    display:grid;
    place-items:center;
    width:58px;height:58px;
    margin:0 auto 12px;
    border-radius:50%;
    background:var(--green);
    color:#04140b;
    box-shadow:0 0 35px rgba(64,227,140,.28);
    font-size:2rem;
    font-weight:1000;
}
.completion-rewards{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px;
    margin:16px 0;
}
.completion-rewards span{
    padding:9px 12px;
    border:1px solid #2d5d48;
    border-radius:12px;
    background:#0b281f;
    color:#dfffee;
}

.next-start{display:none !important}
.next-level-button{
    align-items:center;
    justify-content:center;
    gap:8px;
    width:min(520px,100%);
    min-height:52px;
    margin:18px auto 0;
    padding:12px 18px;
    border:2px solid var(--green);
    border-radius:14px;
    background:linear-gradient(135deg,#123b2d,#0b251d);
    color:#fff;
    cursor:pointer;
    font-weight:900;
    text-align:center;
}
.next-level-button span{
    color:var(--green);
    font-size:.68rem;
    letter-spacing:.1em;
}

/* Mostrar el botón de ascenso que guarda cuántas vidas quedan
   al entrar al siguiente nivel. */

body:not(:has(#loss-1:checked)) .next-l2-start-0{display:flex !important}

body:has(#loss-1:checked):not(:has(#loss-2:checked)) .next-l2-start-1{display:flex !important}

body:has(#loss-2:checked):not(:has(#loss-3:checked)) .next-l2-start-2{display:flex !important}

body:has(#loss-3:checked):not(:has(#loss-4:checked)) .next-l2-start-3{display:flex !important}

body:has(#loss-4:checked):not(:has(#loss-5:checked)) .next-l2-start-4{display:flex !important}

body:not(:has(#loss-1:checked)) .next-l3-start-0{display:flex !important}

body:has(#loss-1:checked):not(:has(#loss-2:checked)) .next-l3-start-1{display:flex !important}

body:has(#loss-2:checked):not(:has(#loss-3:checked)) .next-l3-start-2{display:flex !important}

body:has(#loss-3:checked):not(:has(#loss-4:checked)) .next-l3-start-3{display:flex !important}

body:has(#loss-4:checked):not(:has(#loss-5:checked)) .next-l3-start-4{display:flex !important}

body:not(:has(#loss-1:checked)) .next-l4-start-0{display:flex !important}

body:has(#loss-1:checked):not(:has(#loss-2:checked)) .next-l4-start-1{display:flex !important}

body:has(#loss-2:checked):not(:has(#loss-3:checked)) .next-l4-start-2{display:flex !important}

body:has(#loss-3:checked):not(:has(#loss-4:checked)) .next-l4-start-3{display:flex !important}

body:has(#loss-4:checked):not(:has(#loss-5:checked)) .next-l4-start-4{display:flex !important}

body:not(:has(#loss-1:checked)) .next-l5-start-0{display:flex !important}

body:has(#loss-1:checked):not(:has(#loss-2:checked)) .next-l5-start-1{display:flex !important}

body:has(#loss-2:checked):not(:has(#loss-3:checked)) .next-l5-start-2{display:flex !important}

body:has(#loss-3:checked):not(:has(#loss-4:checked)) .next-l5-start-3{display:flex !important}

body:has(#loss-4:checked):not(:has(#loss-5:checked)) .next-l5-start-4{display:flex !important}

/* ---------------------------------------------------------
   7. FLECHAS FLOTANTES CONTEXTUALES POR NIVEL
   --------------------------------------------------------- */
.nav-up-l1,.nav-up-l2,.nav-up-l3,.nav-up-l4,.nav-up-l5{display:none !important}
body:has(#nivel-1-activo:checked):not(:has(input[name="l2-start"]:checked)) .nav-up-l1{display:flex !important}
body:has(input[name="l2-start"]:checked):not(:has(input[name="l3-start"]:checked)) .nav-up-l2{display:flex !important}
body:has(input[name="l3-start"]:checked):not(:has(input[name="l4-start"]:checked)) .nav-up-l3{display:flex !important}
body:has(input[name="l4-start"]:checked):not(:has(input[name="l5-start"]:checked)) .nav-up-l4{display:flex !important}
body:has(input[name="l5-start"]:checked):not(:has(input[name="l5-win"]:checked)) .nav-up-l5{display:flex !important}

/* Flecha inferior solo para el desafío del nivel actual. */
body:has(#nivel-1-activo:checked):not(:has(input[name="l2-start"]:checked)) .nav-down-l1{display:flex !important}
body:has(input[name="l2-start"]:checked):not(:has(input[name="l3-start"]:checked)) .nav-down-l2{display:flex !important}
body:has(input[name="l3-start"]:checked):not(:has(input[name="l4-start"]:checked)) .nav-down-l3{display:flex !important}
body:has(input[name="l4-start"]:checked):not(:has(input[name="l5-start"]:checked)) .nav-down-l4{display:flex !important}
body:has(input[name="l5-start"]:checked):not(:has(input[name="l5-win"]:checked)) .nav-down-l5{display:flex !important}

/* ---------------------------------------------------------
   8. BYTE CONTEXTUAL CON NUEVO ESTADO DE NIVELES
   --------------------------------------------------------- */
body:has(#nivel-1-activo:checked):not(:has(input[name="l2-start"]:checked)) .help-l1{display:block !important}
body:has(input[name="l2-start"]:checked):not(:has(input[name="l3-start"]:checked)) .help-l2{display:block !important}
body:has(input[name="l3-start"]:checked):not(:has(input[name="l4-start"]:checked)) .help-l3{display:block !important}
body:has(input[name="l4-start"]:checked):not(:has(input[name="l5-start"]:checked)) .help-l4{display:block !important}
body:has(input[name="l5-start"]:checked):not(:has(input[name="l5-win"]:checked)) .help-l5{display:block !important}

/* ---------------------------------------------------------
   9. CERTIFICADO FINAL
   --------------------------------------------------------- */
.victory-screen-v12{
    position:fixed;
    inset:0;
    z-index:220;
    display:grid;
    place-items:center;
    padding:18px;
    overflow:auto;
    background:
        radial-gradient(circle at 50% 5%,rgba(64,227,140,.14),transparent 28%),
        radial-gradient(circle at 85% 80%,rgba(55,216,255,.1),transparent 28%),
        rgba(3,9,15,.97);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .3s ease,visibility .3s ease;
}

body:has(input[name="l5-win"]:checked) .victory-screen-v12{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
}

/* El mismo nombre y avatar del perfil se colocan visualmente
   dentro del certificado. No se duplican datos y no se usa JS. */
body:has(input[name="l5-win"]:checked) .registro-overlay{
    z-index:260 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    pointer-events:none !important;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .hud-compacto,
body:has(input[name="l5-win"]:checked) .registro-overlay .editar-perfil-icon,
body:has(input[name="l5-win"]:checked) .registro-overlay .progreso-hud{
    display:none !important;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .perfil-persistente{
    position:static !important;
    display:block !important;
    height:0 !important;
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
    background:transparent !important;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .perfil-identidad{
    position:fixed;
    top:clamp(178px,25vh,225px);
    left:50%;
    z-index:270;
    width:min(620px,80vw);
    transform:translateX(-50%);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    pointer-events:none;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .avatar-preview{
    width:58px !important;
    height:58px !important;
    border-color:#ffd765 !important;
    border-radius:50% !important;
    background:#0a1c27 !important;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .avatar-preview-item{
    font-size:2.2rem !important;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .nombre-jugador{
    flex:0 1 480px;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .nombre-jugador input{
    width:100% !important;
    height:auto !important;
    padding:2px 6px !important;
    border:0 !important;
    background:transparent !important;
    color:#fff !important;
    box-shadow:none !important;
    text-align:center;
    font-family:Georgia,"Times New Roman",serif !important;
    font-size:clamp(1.65rem,3.4vw,2.65rem) !important;
    font-weight:700 !important;
}

/* El cronómetro del certificado corre desde Nivel 1 aunque el
   certificado todavía esté oculto, y se congela al ganar. */
.certificate-timer{
    --elapsed:0;
    counter-reset:cert-elapsed var(--elapsed);
}
.certificate-timer::after{content:counter(cert-elapsed)}
body:has(#nivel-1-activo:checked) .certificate-timer{
    animation:chronometer 1500s steps(1500,end) forwards;
}
body:has(#nivel-1-activo:checked) .registro-overlay .timer-number{
    animation:chronometer 1500s steps(1500,end) forwards !important;
}
body:has(input[name="l5-win"]:checked) .certificate-timer,
body:has(input[name="l5-win"]:checked) .registro-overlay .timer-number{
    animation-play-state:paused !important;
}

/* Ocultar elementos flotantes cuando el certificado está abierto. */
body:has(input[name="l5-win"]:checked) .byte-help-button,
body:has(input[name="l5-win"]:checked) .resource-button,
body:has(input[name="l5-win"]:checked) .nav-float,
body:has(input[name="l5-win"]:checked) .menu-v8{
    display:none !important;
}

/* ---------------------------------------------------------
   10. RESPONSIVE
   --------------------------------------------------------- */
@media(max-width:820px){
    .level-stage-v12{top:88px}
    .level-hero-v12{grid-template-columns:1fr}
    .level-rank-v12{justify-self:start;min-width:85px;min-height:72px}
    .level-life-status{text-align:left}
    .level-flow-v12{flex-direction:column}
    .level-watermark{font-size:8rem}

    
    
    
    
    
    body:has(input[name="l5-win"]:checked) .registro-overlay .perfil-identidad{
        top:210px;
        width:min(90vw,580px);
    }
}

@media(max-width:540px){
    
    
    
    
    body:has(input[name="l5-win"]:checked) .registro-overlay .perfil-identidad{
        top:240px;
        flex-direction:column;
        gap:5px;
    }
    
}

body:has(input[name="l1-win"]:checked) .node-l1 .node-num,
body:has(input[name="l2-win"]:checked) .node-l2 .node-num,
body:has(input[name="l3-win"]:checked) .node-l3 .node-num,
body:has(input[name="l4-win"]:checked) .node-l4 .node-num,
body:has(input[name="l5-win"]:checked) .node-l5 .node-num{display:none !important}

body:has(input[name="l1-win"]:checked) .node-l1 .node-check,
body:has(input[name="l2-win"]:checked) .node-l2 .node-check,
body:has(input[name="l3-win"]:checked) .node-l3 .node-check,
body:has(input[name="l4-win"]:checked) .node-l4 .node-check,
body:has(input[name="l5-win"]:checked) .node-l5 .node-check{display:block !important}

body:has(input[name="l1-win"]:checked) .node-l1 .node-badge,
body:has(input[name="l2-win"]:checked) .node-l2 .node-badge,
body:has(input[name="l3-win"]:checked) .node-l3 .node-badge,
body:has(input[name="l4-win"]:checked) .node-l4 .node-badge,
body:has(input[name="l5-win"]:checked) .node-l5 .node-badge{
    border-color:var(--green) !important;
    background:var(--green) !important;
}

/* V12 · limpieza de estados heredados de versiones anteriores */
.byte-v8 .help-l1,
.byte-v8 .help-l2,
.byte-v8 .help-l3,
.byte-v8 .help-l4,
.byte-v8 .help-l5{
    display:none !important;
}

.nav-down-l1,
.nav-down-l2,
.nav-down-l3,
.nav-down-l4,
.nav-down-l5{
    display:none !important;
}

body:has(#nivel-1-activo:checked):not(:has(input[name="l2-start"]:checked)) .help-l1{display:block !important}
body:has(input[name="l2-start"]:checked):not(:has(input[name="l3-start"]:checked)) .help-l2{display:block !important}
body:has(input[name="l3-start"]:checked):not(:has(input[name="l4-start"]:checked)) .help-l3{display:block !important}
body:has(input[name="l4-start"]:checked):not(:has(input[name="l5-start"]:checked)) .help-l4{display:block !important}
body:has(input[name="l5-start"]:checked):not(:has(input[name="l5-win"]:checked)) .help-l5{display:block !important}

body:has(#nivel-1-activo:checked):not(:has(input[name="l2-start"]:checked)) .nav-down-l1{display:flex !important}
body:has(input[name="l2-start"]:checked):not(:has(input[name="l3-start"]:checked)) .nav-down-l2{display:flex !important}
body:has(input[name="l3-start"]:checked):not(:has(input[name="l4-start"]:checked)) .nav-down-l3{display:flex !important}
body:has(input[name="l4-start"]:checked):not(:has(input[name="l5-start"]:checked)) .nav-down-l4{display:flex !important}
body:has(input[name="l5-start"]:checked):not(:has(input[name="l5-win"]:checked)) .nav-down-l5{display:flex !important}

/* =========================================================
   V13 · REINTENTO SIN REPETIR VIDEO NI FOTOS
   ========================================================= */

/* paso-fotos y paso-info están fuera de game-state.
   Al resetear la campaña quedan marcados, por lo que Primeros pasos
   reaparece directamente en la tercera pantalla: Cómo funciona la partida. */
.intro-persistent-state{
    position:fixed;
    opacity:0;
    pointer-events:none;
}

/* Al perder, el botón reset limpia SOLO game-state:
   - vidas
   - puntaje
   - gemas
   - respuestas
   - niveles
   - cronómetro
   Conserva:
   - partida-activa
   - nombre
   - avatar
   - edad
   - paso-fotos
   - paso-info
*/

/* La pantalla de reglas conserva su propia posición de scroll.
   Como el Nivel 1 se inicia desde el botón final, al volver tras un
   Game Over el usuario regresa naturalmente a esa misma zona. */
.primer-paso-info-screen{
    scroll-behavior:auto;
}

.retry-destination-v13{
    max-width:470px;
    margin:14px auto 0;
    padding:12px 14px;
    border:1px solid rgba(55,216,255,.35);
    border-radius:13px;
    background:rgba(55,216,255,.055);
    color:#cfe7f4;
    font-size:.82rem;
    line-height:1.45;
}

/* Cuando game-state vuelve a estado inicial pero paso-info sigue marcado,
   asegurar que se muestre solamente la pantalla de reglas. */
body:has(#partida-activa:checked):has(#paso-info:checked):not(:has(#nivel-1-activo:checked)) .primer-paso-video-screen,
body:has(#partida-activa:checked):has(#paso-info:checked):not(:has(#nivel-1-activo:checked)) .primer-paso-fotos-screen{
    display:none !important;
}

body:has(#partida-activa:checked):has(#paso-info:checked):not(:has(#nivel-1-activo:checked)) .primer-paso-info-screen{
    display:block !important;
}

/* Después del reset, BYTE también queda contextualizado en las reglas. */
body:has(#partida-activa:checked):has(#paso-info:checked):not(:has(#nivel-1-activo:checked)) .help-paso-video,
body:has(#partida-activa:checked):has(#paso-info:checked):not(:has(#nivel-1-activo:checked)) .help-paso-fotos{
    display:none !important;
}
body:has(#partida-activa:checked):has(#paso-info:checked):not(:has(#nivel-1-activo:checked)) .help-paso-info{
    display:block !important;
}

/* =========================================================
   V14 · CERTIFICADO IMPRIMIBLE + NOMBRE EN MAYÚSCULAS
   + DEVOLUCIONES ESPECÍFICAS + ASCENSO FLOTANTE
   ========================================================= */

/* Nombre siempre visualmente en mayúsculas, sin importar cómo se escriba. */
#nombre-jugador,
body:has(input[name="l5-win"]:checked) .registro-overlay .nombre-jugador input{
    text-transform:uppercase !important;
}

/* ---------------------------------------------------------
   DEVOLUCIONES ESPECÍFICAS DE RESPUESTAS INCORRECTAS
   --------------------------------------------------------- */
.wrong-attempt-layer{display:none}
body:not(:has(#loss-1:checked)) .wrong-loss-layer-1{display:block}
body:has(#loss-1:checked):not(:has(#loss-2:checked)) .wrong-loss-layer-2{display:block}
body:has(#loss-2:checked):not(:has(#loss-3:checked)) .wrong-loss-layer-3{display:block}
body:has(#loss-3:checked):not(:has(#loss-4:checked)) .wrong-loss-layer-4{display:block}
body:has(#loss-4:checked):not(:has(#loss-5:checked)) .wrong-loss-layer-5{display:block}

.wrong-answer-feedback{
    display:none;
    margin:10px 0 16px;
    padding:18px 20px;
    border:1px solid rgba(255,94,111,.64);
    border-left:5px solid var(--red);
    border-radius:15px;
    background:
        linear-gradient(135deg,rgba(255,94,111,.13),rgba(255,83,178,.045)),
        #0b1823;
    box-shadow:0 14px 32px rgba(0,0,0,.18);
}
.wrong-feedback-state:checked + .wrong-answer-trigger{
    display:none !important;
}
.wrong-feedback-state:checked ~ .wrong-answer-feedback{
    display:block;
}
.wrong-feedback-title{
    display:flex;
    align-items:center;
    gap:9px;
    margin-bottom:8px;
    color:#fff;
    font-size:1rem;
}
.wrong-feedback-title>span{
    display:grid;
    place-items:center;
    width:30px;height:30px;
    border-radius:50%;
    background:var(--red);
    color:#fff;
    font-weight:1000;
}
.wrong-answer-feedback p{
    margin:7px 0;
    color:#d9e7ef;
    line-height:1.5;
}
.wrong-feedback-cost{
    color:#ffb6bf !important;
    font-size:.82rem;
}
.accept-loss-button{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    width:min(440px,100%);
    min-height:44px;
    margin:14px 0 0;
    padding:9px 15px;
    border:1px solid rgba(255,94,111,.72);
    border-radius:11px;
    background:#34131c;
    color:#fff;
    cursor:pointer;
    font-size:.76rem;
    font-weight:900;
    letter-spacing:.04em;
}
.accept-loss-button span{color:#ff9ba6}
.feedback-instruction-v14{
    margin:8px 0 0;
    color:#91acbd;
    font-size:.82rem;
}

/* Mientras se está leyendo una devolución, no se puede elegir otra respuesta
   hasta aceptar la pérdida de la vida correspondiente. */

body:not(:has(#loss-1:checked)) .opciones-l1:has(.wrong-loss-layer-1 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:not(:has(#loss-1:checked)) .opciones-l1:has(.wrong-loss-layer-1 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:not(:has(#loss-1:checked)) .opciones-l1:has(.wrong-loss-layer-1 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-1:checked):not(:has(#loss-2:checked)) .opciones-l1:has(.wrong-loss-layer-2 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-1:checked):not(:has(#loss-2:checked)) .opciones-l1:has(.wrong-loss-layer-2 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-1:checked):not(:has(#loss-2:checked)) .opciones-l1:has(.wrong-loss-layer-2 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-2:checked):not(:has(#loss-3:checked)) .opciones-l1:has(.wrong-loss-layer-3 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-2:checked):not(:has(#loss-3:checked)) .opciones-l1:has(.wrong-loss-layer-3 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-2:checked):not(:has(#loss-3:checked)) .opciones-l1:has(.wrong-loss-layer-3 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-3:checked):not(:has(#loss-4:checked)) .opciones-l1:has(.wrong-loss-layer-4 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-3:checked):not(:has(#loss-4:checked)) .opciones-l1:has(.wrong-loss-layer-4 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-3:checked):not(:has(#loss-4:checked)) .opciones-l1:has(.wrong-loss-layer-4 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-4:checked):not(:has(#loss-5:checked)) .opciones-l1:has(.wrong-loss-layer-5 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-4:checked):not(:has(#loss-5:checked)) .opciones-l1:has(.wrong-loss-layer-5 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-4:checked):not(:has(#loss-5:checked)) .opciones-l1:has(.wrong-loss-layer-5 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:not(:has(#loss-1:checked)) .opciones-l2:has(.wrong-loss-layer-1 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:not(:has(#loss-1:checked)) .opciones-l2:has(.wrong-loss-layer-1 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:not(:has(#loss-1:checked)) .opciones-l2:has(.wrong-loss-layer-1 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-1:checked):not(:has(#loss-2:checked)) .opciones-l2:has(.wrong-loss-layer-2 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-1:checked):not(:has(#loss-2:checked)) .opciones-l2:has(.wrong-loss-layer-2 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-1:checked):not(:has(#loss-2:checked)) .opciones-l2:has(.wrong-loss-layer-2 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-2:checked):not(:has(#loss-3:checked)) .opciones-l2:has(.wrong-loss-layer-3 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-2:checked):not(:has(#loss-3:checked)) .opciones-l2:has(.wrong-loss-layer-3 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-2:checked):not(:has(#loss-3:checked)) .opciones-l2:has(.wrong-loss-layer-3 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-3:checked):not(:has(#loss-4:checked)) .opciones-l2:has(.wrong-loss-layer-4 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-3:checked):not(:has(#loss-4:checked)) .opciones-l2:has(.wrong-loss-layer-4 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-3:checked):not(:has(#loss-4:checked)) .opciones-l2:has(.wrong-loss-layer-4 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-4:checked):not(:has(#loss-5:checked)) .opciones-l2:has(.wrong-loss-layer-5 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-4:checked):not(:has(#loss-5:checked)) .opciones-l2:has(.wrong-loss-layer-5 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-4:checked):not(:has(#loss-5:checked)) .opciones-l2:has(.wrong-loss-layer-5 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:not(:has(#loss-1:checked)) .opciones-l3:has(.wrong-loss-layer-1 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:not(:has(#loss-1:checked)) .opciones-l3:has(.wrong-loss-layer-1 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:not(:has(#loss-1:checked)) .opciones-l3:has(.wrong-loss-layer-1 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-1:checked):not(:has(#loss-2:checked)) .opciones-l3:has(.wrong-loss-layer-2 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-1:checked):not(:has(#loss-2:checked)) .opciones-l3:has(.wrong-loss-layer-2 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-1:checked):not(:has(#loss-2:checked)) .opciones-l3:has(.wrong-loss-layer-2 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-2:checked):not(:has(#loss-3:checked)) .opciones-l3:has(.wrong-loss-layer-3 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-2:checked):not(:has(#loss-3:checked)) .opciones-l3:has(.wrong-loss-layer-3 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-2:checked):not(:has(#loss-3:checked)) .opciones-l3:has(.wrong-loss-layer-3 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-3:checked):not(:has(#loss-4:checked)) .opciones-l3:has(.wrong-loss-layer-4 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-3:checked):not(:has(#loss-4:checked)) .opciones-l3:has(.wrong-loss-layer-4 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-3:checked):not(:has(#loss-4:checked)) .opciones-l3:has(.wrong-loss-layer-4 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-4:checked):not(:has(#loss-5:checked)) .opciones-l3:has(.wrong-loss-layer-5 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-4:checked):not(:has(#loss-5:checked)) .opciones-l3:has(.wrong-loss-layer-5 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-4:checked):not(:has(#loss-5:checked)) .opciones-l3:has(.wrong-loss-layer-5 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:not(:has(#loss-1:checked)) .opciones-l4:has(.wrong-loss-layer-1 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:not(:has(#loss-1:checked)) .opciones-l4:has(.wrong-loss-layer-1 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:not(:has(#loss-1:checked)) .opciones-l4:has(.wrong-loss-layer-1 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-1:checked):not(:has(#loss-2:checked)) .opciones-l4:has(.wrong-loss-layer-2 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-1:checked):not(:has(#loss-2:checked)) .opciones-l4:has(.wrong-loss-layer-2 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-1:checked):not(:has(#loss-2:checked)) .opciones-l4:has(.wrong-loss-layer-2 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-2:checked):not(:has(#loss-3:checked)) .opciones-l4:has(.wrong-loss-layer-3 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-2:checked):not(:has(#loss-3:checked)) .opciones-l4:has(.wrong-loss-layer-3 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-2:checked):not(:has(#loss-3:checked)) .opciones-l4:has(.wrong-loss-layer-3 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-3:checked):not(:has(#loss-4:checked)) .opciones-l4:has(.wrong-loss-layer-4 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-3:checked):not(:has(#loss-4:checked)) .opciones-l4:has(.wrong-loss-layer-4 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-3:checked):not(:has(#loss-4:checked)) .opciones-l4:has(.wrong-loss-layer-4 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-4:checked):not(:has(#loss-5:checked)) .opciones-l4:has(.wrong-loss-layer-5 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-4:checked):not(:has(#loss-5:checked)) .opciones-l4:has(.wrong-loss-layer-5 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-4:checked):not(:has(#loss-5:checked)) .opciones-l4:has(.wrong-loss-layer-5 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:not(:has(#loss-1:checked)) .opciones-l5:has(.wrong-loss-layer-1 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:not(:has(#loss-1:checked)) .opciones-l5:has(.wrong-loss-layer-1 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:not(:has(#loss-1:checked)) .opciones-l5:has(.wrong-loss-layer-1 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-1:checked):not(:has(#loss-2:checked)) .opciones-l5:has(.wrong-loss-layer-2 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-1:checked):not(:has(#loss-2:checked)) .opciones-l5:has(.wrong-loss-layer-2 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-1:checked):not(:has(#loss-2:checked)) .opciones-l5:has(.wrong-loss-layer-2 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-2:checked):not(:has(#loss-3:checked)) .opciones-l5:has(.wrong-loss-layer-3 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-2:checked):not(:has(#loss-3:checked)) .opciones-l5:has(.wrong-loss-layer-3 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-2:checked):not(:has(#loss-3:checked)) .opciones-l5:has(.wrong-loss-layer-3 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-3:checked):not(:has(#loss-4:checked)) .opciones-l5:has(.wrong-loss-layer-4 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-3:checked):not(:has(#loss-4:checked)) .opciones-l5:has(.wrong-loss-layer-4 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-3:checked):not(:has(#loss-4:checked)) .opciones-l5:has(.wrong-loss-layer-4 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

body:has(#loss-4:checked):not(:has(#loss-5:checked)) .opciones-l5:has(.wrong-loss-layer-5 .wrong-feedback-state:checked) .wrong-answer-trigger,
body:has(#loss-4:checked):not(:has(#loss-5:checked)) .opciones-l5:has(.wrong-loss-layer-5 .wrong-feedback-state:checked) .correct-layer{
    pointer-events:none !important;
    opacity:.30 !important;
}
body:has(#loss-4:checked):not(:has(#loss-5:checked)) .opciones-l5:has(.wrong-loss-layer-5 .wrong-feedback-state:checked) .wrong-answer-feedback{
    opacity:1 !important;
}

/* ---------------------------------------------------------
   BOTÓN FLOTANTE PARA PASAR AL SIGUIENTE NIVEL
   --------------------------------------------------------- */
.next-level-button{
    position:fixed !important;
    left:50%;
    bottom:20px;
    z-index:205;
    width:min(520px,calc(100vw - 150px)) !important;
    min-height:58px !important;
    margin:0 !important;
    transform:translateX(-50%);
    border:2px solid var(--green) !important;
    border-radius:16px !important;
    background:linear-gradient(135deg,#103b2a,#0b251c 58%,#092019) !important;
    box-shadow:0 18px 48px rgba(0,0,0,.45),0 0 30px rgba(64,227,140,.18);
    animation:nextLevelPulse 1.8s ease-in-out infinite;
}
.next-level-button:hover{
    transform:translateX(-50%) translateY(-3px) !important;
    box-shadow:0 22px 55px rgba(0,0,0,.52),0 0 38px rgba(64,227,140,.32);
}
.next-level-kicker{
    color:var(--green) !important;
    font-size:.62rem !important;
    letter-spacing:.12em !important;
}
.next-level-button strong{
    color:#fff;
    font-size:.96rem;
}
.next-level-arrow{
    color:#fff !important;
    font-size:1.25rem !important;
}
@keyframes nextLevelPulse{
    0%,100%{box-shadow:0 18px 48px rgba(0,0,0,.45),0 0 20px rgba(64,227,140,.12)}
    50%{box-shadow:0 18px 48px rgba(0,0,0,.48),0 0 34px rgba(64,227,140,.28)}
}
.level-complete-v12{
    padding-bottom:40px !important;
}
/* Al aprobar, la flecha inferior normal deja lugar al botón de ascenso. */
body:has(input[name="l1-win"]:checked):not(:has(input[name="l2-start"]:checked)) .nav-down-l1,
body:has(input[name="l2-win"]:checked):not(:has(input[name="l3-start"]:checked)) .nav-down-l2,
body:has(input[name="l3-win"]:checked):not(:has(input[name="l4-start"]:checked)) .nav-down-l3,
body:has(input[name="l4-win"]:checked):not(:has(input[name="l5-start"]:checked)) .nav-down-l4{
    display:none !important;
}

/* ---------------------------------------------------------
   CERTIFICADO V14
   --------------------------------------------------------- */

.qr-stack{
    display:grid;
    place-items:center;
    min-height:156px;
}
.qr-variant{display:none}
.qr-variant img{
    display:block;
    width:148px;
    height:148px;
    margin:auto;
    border:7px solid #fff;
    border-radius:7px;
    background:#fff;
}
.qr-variant small{
    display:block;
    margin-top:5px;
    color:#9bb0bd;
    font-size:.48rem;
    letter-spacing:.02em;
}

/* El nombre dentro del certificado queda completamente en mayúsculas. */
body:has(input[name="l5-win"]:checked) .registro-overlay .nombre-jugador input{
    text-transform:uppercase !important;
}

/* ---------------------------------------------------------
   IMPRESIÓN / GUARDAR COMO PDF
   --------------------------------------------------------- */
@media print{
    @page{
        size:A4 landscape;
        margin:8mm;
    }

    body{
        background:#fff !important;
        color:#111 !important;
    }

    body>*:not(.registro-overlay):not(.game-shell){
        display:none !important;
    }

    .game-shell>*:not(#contenido-principal),
    #contenido-principal>*:not(.game-state-controls):not(.campania-v12),
    .campania-v12>*:not(.victory-screen-v14){
        display:none !important;
    }

    .victory-screen-v14{
        position:static !important;
        inset:auto !important;
        display:block !important;
        opacity:1 !important;
        visibility:visible !important;
        pointer-events:auto !important;
        overflow:visible !important;
        padding:0 !important;
        background:#fff !important;
    }

    

    

    

    

    

    /* Mantener el nombre real del jugador, que vive en la barra de perfil. */
    .registro-overlay{
        display:block !important;
        position:static !important;
        height:0 !important;
        min-height:0 !important;
        padding:0 !important;
        border:0 !important;
        background:transparent !important;
        box-shadow:none !important;
    }
    .registro-overlay>*:not(.perfil-persistente){display:none !important}
    .registro-overlay .perfil-persistente{
        display:block !important;
        height:0 !important;
        padding:0 !important;
        margin:0 !important;
        background:transparent !important;
        border:0 !important;
    }
    .registro-overlay .perfil-identidad{
        position:fixed !important;
        top:61mm !important;
        left:50% !important;
        width:150mm !important;
        transform:translateX(-50%) !important;
        display:flex !important;
        justify-content:center !important;
        gap:8mm !important;
        z-index:999 !important;
    }
    .registro-overlay .avatar-preview{
        width:16mm !important;
        height:16mm !important;
        border:1pt solid #9a7a19 !important;
        background:#fff !important;
    }
    .registro-overlay .nombre-jugador{
        flex:0 1 115mm !important;
    }
    .registro-overlay .nombre-jugador input{
        color:#111 !important;
        background:transparent !important;
        font-size:20pt !important;
        text-align:center !important;
        text-transform:uppercase !important;
    }
    .registro-overlay .editar-perfil-icon,
    .registro-overlay .hud-compacto,
    .registro-overlay .progreso-hud{
        display:none !important;
    }
}

/* QR condicional */
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-100-100-100-100-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-100-100-100-100-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-25:checked) .qr-100-100-100-100-25{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-10:checked) .qr-100-100-100-100-10{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-0:checked) .qr-100-100-100-100-0{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-100-100-100-50-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-50:checked) .qr-100-100-100-50-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-25:checked) .qr-100-100-100-50-25{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-10:checked) .qr-100-100-100-50-10{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-25:checked):has(#l5-win-100:checked) .qr-100-100-100-25-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-25:checked):has(#l5-win-50:checked) .qr-100-100-100-25-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-25:checked):has(#l5-win-25:checked) .qr-100-100-100-25-25{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-10:checked):has(#l5-win-100:checked) .qr-100-100-100-10-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-10:checked):has(#l5-win-50:checked) .qr-100-100-100-10-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-0:checked):has(#l5-win-100:checked) .qr-100-100-100-0-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-100-100-50-100-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-100-100-50-100-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-25:checked) .qr-100-100-50-100-25{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-10:checked) .qr-100-100-50-100-10{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-100-100-50-50-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-50:checked):has(#l5-win-50:checked) .qr-100-100-50-50-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-50:checked):has(#l5-win-25:checked) .qr-100-100-50-50-25{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-25:checked):has(#l5-win-100:checked) .qr-100-100-50-25-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-25:checked):has(#l5-win-50:checked) .qr-100-100-50-25-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-10:checked):has(#l5-win-100:checked) .qr-100-100-50-10-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-25:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-100-100-25-100-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-25:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-100-100-25-100-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-25:checked):has(#l4-win-100:checked):has(#l5-win-25:checked) .qr-100-100-25-100-25{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-25:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-100-100-25-50-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-25:checked):has(#l4-win-50:checked):has(#l5-win-50:checked) .qr-100-100-25-50-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-25:checked):has(#l4-win-25:checked):has(#l5-win-100:checked) .qr-100-100-25-25-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-10:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-100-100-10-100-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-10:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-100-100-10-100-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-10:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-100-100-10-50-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-100:checked):has(#l3-win-0:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-100-100-0-100-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-100-50-100-100-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-100-50-100-100-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-25:checked) .qr-100-50-100-100-25{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-10:checked) .qr-100-50-100-100-10{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-100-50-100-50-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-50:checked) .qr-100-50-100-50-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-25:checked) .qr-100-50-100-50-25{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-25:checked):has(#l5-win-100:checked) .qr-100-50-100-25-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-25:checked):has(#l5-win-50:checked) .qr-100-50-100-25-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-10:checked):has(#l5-win-100:checked) .qr-100-50-100-10-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-100-50-50-100-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-100-50-50-100-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-25:checked) .qr-100-50-50-100-25{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-50:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-100-50-50-50-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-50:checked):has(#l4-win-50:checked):has(#l5-win-50:checked) .qr-100-50-50-50-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-50:checked):has(#l4-win-25:checked):has(#l5-win-100:checked) .qr-100-50-50-25-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-25:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-100-50-25-100-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-25:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-100-50-25-100-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-25:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-100-50-25-50-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-50:checked):has(#l3-win-10:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-100-50-10-100-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-25:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-100-25-100-100-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-25:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-100-25-100-100-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-25:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-25:checked) .qr-100-25-100-100-25{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-25:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-100-25-100-50-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-25:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-50:checked) .qr-100-25-100-50-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-25:checked):has(#l3-win-100:checked):has(#l4-win-25:checked):has(#l5-win-100:checked) .qr-100-25-100-25-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-25:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-100-25-50-100-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-25:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-100-25-50-100-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-25:checked):has(#l3-win-50:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-100-25-50-50-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-25:checked):has(#l3-win-25:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-100-25-25-100-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-10:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-100-10-100-100-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-10:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-100-10-100-100-50{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-10:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-100-10-100-50-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-10:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-100-10-50-100-100{display:block !important}
body:has(#l1-win-100:checked):has(#l2-win-0:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-100-0-100-100-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-50-100-100-100-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-50-100-100-100-50{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-25:checked) .qr-50-100-100-100-25{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-10:checked) .qr-50-100-100-100-10{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-50-100-100-50-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-50:checked) .qr-50-100-100-50-50{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-25:checked) .qr-50-100-100-50-25{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-25:checked):has(#l5-win-100:checked) .qr-50-100-100-25-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-25:checked):has(#l5-win-50:checked) .qr-50-100-100-25-50{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-10:checked):has(#l5-win-100:checked) .qr-50-100-100-10-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-50-100-50-100-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-50-100-50-100-50{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-25:checked) .qr-50-100-50-100-25{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-50-100-50-50-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-50:checked):has(#l5-win-50:checked) .qr-50-100-50-50-50{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-25:checked):has(#l5-win-100:checked) .qr-50-100-50-25-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-25:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-50-100-25-100-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-25:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-50-100-25-100-50{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-25:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-50-100-25-50-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-100:checked):has(#l3-win-10:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-50-100-10-100-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-50-50-100-100-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-50-50-100-100-50{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-25:checked) .qr-50-50-100-100-25{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-50-50-100-50-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-50:checked) .qr-50-50-100-50-50{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-25:checked):has(#l5-win-100:checked) .qr-50-50-100-25-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-50:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-50-50-50-100-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-50:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-50-50-50-100-50{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-50:checked):has(#l3-win-50:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-50-50-50-50-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-50:checked):has(#l3-win-25:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-50-50-25-100-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-25:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-50-25-100-100-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-25:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-50-25-100-100-50{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-25:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-50-25-100-50-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-25:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-50-25-50-100-100{display:block !important}
body:has(#l1-win-50:checked):has(#l2-win-10:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-50-10-100-100-100{display:block !important}
body:has(#l1-win-25:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-25-100-100-100-100{display:block !important}
body:has(#l1-win-25:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-25-100-100-100-50{display:block !important}
body:has(#l1-win-25:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-25:checked) .qr-25-100-100-100-25{display:block !important}
body:has(#l1-win-25:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-25-100-100-50-100{display:block !important}
body:has(#l1-win-25:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-50:checked) .qr-25-100-100-50-50{display:block !important}
body:has(#l1-win-25:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-25:checked):has(#l5-win-100:checked) .qr-25-100-100-25-100{display:block !important}
body:has(#l1-win-25:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-25-100-50-100-100{display:block !important}
body:has(#l1-win-25:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-25-100-50-100-50{display:block !important}
body:has(#l1-win-25:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-25-100-50-50-100{display:block !important}
body:has(#l1-win-25:checked):has(#l2-win-100:checked):has(#l3-win-25:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-25-100-25-100-100{display:block !important}
body:has(#l1-win-25:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-25-50-100-100-100{display:block !important}
body:has(#l1-win-25:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-25-50-100-100-50{display:block !important}
body:has(#l1-win-25:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-25-50-100-50-100{display:block !important}
body:has(#l1-win-25:checked):has(#l2-win-50:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-25-50-50-100-100{display:block !important}
body:has(#l1-win-25:checked):has(#l2-win-25:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-25-25-100-100-100{display:block !important}
body:has(#l1-win-10:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-10-100-100-100-100{display:block !important}
body:has(#l1-win-10:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-50:checked) .qr-10-100-100-100-50{display:block !important}
body:has(#l1-win-10:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-50:checked):has(#l5-win-100:checked) .qr-10-100-100-50-100{display:block !important}
body:has(#l1-win-10:checked):has(#l2-win-100:checked):has(#l3-win-50:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-10-100-50-100-100{display:block !important}
body:has(#l1-win-10:checked):has(#l2-win-50:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-10-50-100-100-100{display:block !important}
body:has(#l1-win-0:checked):has(#l2-win-100:checked):has(#l3-win-100:checked):has(#l4-win-100:checked):has(#l5-win-100:checked) .qr-0-100-100-100-100{display:block !important}

@media(max-width:620px){
    .next-level-button{
        width:calc(100vw - 110px) !important;
        bottom:14px;
        min-height:52px !important;
    }
    
}

/* =========================================================
   V15 · CERTIFICADO FINAL PREMIUM / PROFESIONAL
   ========================================================= */

.victory-screen-v15{
    z-index:500 !important;
    align-items:flex-start !important;
    padding:18px !important;
    background:
        radial-gradient(circle at 50% 0%,rgba(196,160,74,.16),transparent 26%),
        linear-gradient(180deg,#07111b 0%,#03080d 100%) !important;
}

.certificate-shell-v15{
    width:min(1120px,100%);
    margin:0 auto 28px;
}

.certificate-paper-v15{
    position:relative;
    min-height:720px;
    overflow:hidden;
    padding:34px 42px 28px;
    border:1px solid #c9b783;
    background:
        linear-gradient(rgba(255,255,255,.97),rgba(255,255,255,.97)),
        repeating-linear-gradient(0deg,transparent 0 18px,rgba(10,32,52,.025) 18px 19px);
    color:#122638;
    box-shadow:
        0 30px 90px rgba(0,0,0,.58),
        0 0 0 8px rgba(255,255,255,.04);
}

.certificate-paper-v15::before{
    content:"ACS";
    position:absolute;
    right:-42px;
    top:145px;
    color:rgba(13,47,73,.035);
    font-family:Georgia,"Times New Roman",serif;
    font-size:15rem;
    font-weight:700;
    line-height:1;
    transform:rotate(-90deg);
    transform-origin:center;
    pointer-events:none;
}

.certificate-paper-v15::after{
    content:"";
    position:absolute;
    inset:12px;
    border:1px solid rgba(181,145,58,.48);
    pointer-events:none;
}

.certificate-corner{
    position:absolute;
    z-index:2;
    width:74px;
    height:74px;
    pointer-events:none;
}
.certificate-corner::before,
.certificate-corner::after{
    content:"";
    position:absolute;
    background:#b88e2d;
}
.corner-tl{top:12px;left:12px}
.corner-tr{top:12px;right:12px;transform:rotate(90deg)}
.corner-bl{bottom:12px;left:12px;transform:rotate(-90deg)}
.corner-br{bottom:12px;right:12px;transform:rotate(180deg)}
.certificate-corner::before{left:0;top:0;width:54px;height:2px}
.certificate-corner::after{left:0;top:0;width:2px;height:54px}

.certificate-header-v15{
    position:relative;
    z-index:3;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:22px;
    padding-bottom:17px;
    border-bottom:1px solid #d8d0ba;
}

.certificate-brand-v15{
    display:flex;
    align-items:center;
    gap:12px;
    text-align:left;
}
.certificate-brand-mark{
    display:grid;
    place-items:center;
    width:48px;
    height:48px;
    border:1px solid #b88e2d;
    background:#102d45;
    color:#f0d28b;
    font-family:Georgia,"Times New Roman",serif;
    font-size:.9rem;
    font-weight:700;
    letter-spacing:.08em;
}
.certificate-brand-v15 p{
    margin:0 0 2px;
    color:#73808a;
    font-size:.58rem;
    font-weight:800;
    letter-spacing:.14em;
}
.certificate-brand-v15 strong{
    color:#102d45;
    font-size:.82rem;
    letter-spacing:.06em;
}

.certificate-status-v15{
    display:flex;
    align-items:center;
    gap:9px;
    padding:8px 12px;
    border:1px solid #d6c28c;
    background:#fbf7ec;
}
.certificate-status-v15 span{
    color:#102d45;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.35rem;
    font-weight:700;
}
.certificate-status-v15 small{
    max-width:70px;
    color:#8a6d2d;
    font-size:.52rem;
    font-weight:900;
    line-height:1.2;
    letter-spacing:.08em;
}

.certificate-title-block-v15{
    position:relative;
    z-index:3;
    margin:24px auto 8px;
    text-align:center;
}
.certificate-overline-v15{
    margin:0;
    color:#9b7a31;
    font-size:.62rem;
    font-weight:900;
    letter-spacing:.22em;
}
.certificate-title-block-v15 h2{
    margin:5px 0 8px;
    color:#102d45 !important;
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(2rem,4vw,3.4rem);
    font-weight:600;
    line-height:1;
}
.certificate-title-rule{
    width:100px;
    height:2px;
    margin:0 auto;
    background:linear-gradient(90deg,transparent,#b88e2d,transparent);
}

.certificate-statement-v15{
    position:relative;
    z-index:3;
    max-width:840px;
    margin:15px auto 18px;
    text-align:center;
}
.certificate-prefix-v15{
    margin:0;
    color:#546674;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.02rem;
}
.certificate-name-slot-v15{
    height:68px;
    margin:0 auto 2px;
    border-bottom:1px solid #d8c997;
}
.certificate-main-text-v15{
    max-width:780px;
    margin:8px auto 0;
    color:#283d4d;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.03rem;
    line-height:1.55;
}
.certificate-main-text-v15 strong{color:#102d45}

.section-heading-v15{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:10px;
    text-align:left;
}
.section-heading-v15>span{
    display:grid;
    place-items:center;
    width:31px;height:31px;
    border:1px solid #d5be80;
    color:#9a7421;
    font-size:.62rem;
    font-weight:900;
}
.section-heading-v15 small{
    display:block;
    color:#87939b;
    font-size:.5rem;
    font-weight:900;
    letter-spacing:.12em;
}
.section-heading-v15 strong{
    color:#16344b;
    font-size:.78rem;
}

.certificate-scores-v15{
    position:relative;
    z-index:3;
    margin:0 auto 14px;
}
.level-score-grid-v15{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:8px;
}
.level-score-grid-v15 article{
    position:relative;
    padding:12px 10px 10px;
    border:1px solid #d9d6ca;
    background:#faf9f5;
    text-align:center;
}
.level-score-grid-v15 span{
    display:block;
    color:#71808a;
    font-size:.54rem;
    font-weight:900;
    letter-spacing:.08em;
}
.level-score-grid-v15 strong{
    display:block;
    margin:2px 0 0;
    color:#102d45;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.45rem;
}
.level-score-grid-v15 small{
    color:#90999f;
    font-size:.52rem;
}
.level-score-grid-v15 i{
    position:absolute;
    top:6px;
    right:7px;
    color:#2b8a5f;
    font-style:normal;
    font-size:.72rem;
    font-weight:1000;
}

.certificate-summary-v15{
    position:relative;
    z-index:3;
    display:grid;
    grid-template-columns:minmax(0,1fr) 205px;
    gap:14px;
    align-items:stretch;
    margin-top:12px;
}

.certificate-main-metrics-v15{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:8px;
}
.certificate-main-metrics-v15 article{
    display:flex;
    min-height:98px;
    flex-direction:column;
    justify-content:center;
    padding:11px;
    border:1px solid #d9d6ca;
    background:#fff;
    text-align:center;
}
.certificate-main-metrics-v15 small{
    color:#7e8c95;
    font-size:.51rem;
    font-weight:900;
    letter-spacing:.08em;
}
.certificate-main-metrics-v15 div{
    margin-top:7px;
}
.certificate-main-metrics-v15 strong{
    color:#102d45 !important;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.55rem;
}
.certificate-main-metrics-v15 span{
    color:#8c979e;
    font-size:.65rem;
}

.certificate-verification-v15{
    padding:10px 10px 9px;
    border:1px solid #d4c08d;
    background:#fbf8ef;
    text-align:center;
}
.verification-heading-v15{
    display:flex;
    justify-content:space-between;
    gap:8px;
    margin-bottom:6px;
}
.verification-heading-v15 span{
    color:#102d45;
    font-size:.58rem;
    font-weight:900;
    letter-spacing:.08em;
}
.verification-heading-v15 small{
    color:#9a7421;
    font-size:.48rem;
    font-weight:900;
}
.qr-stack-v15{
    min-height:120px !important;
}
.qr-stack-v15 .qr-variant img{
    width:118px !important;
    height:118px !important;
    border:4px solid #fff !important;
    border-radius:0 !important;
}
.qr-stack-v15 .qr-variant small{
    color:#526673 !important;
    font-size:.43rem !important;
}
.certificate-verification-v15>p{
    max-width:170px;
    margin:6px auto 0;
    color:#6e7d86;
    font-size:.52rem;
    line-height:1.35;
}

.certificate-footer-v15{
    position:relative;
    z-index:3;
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:end;
    gap:24px;
    margin-top:18px;
    padding-top:14px;
    border-top:1px solid #ddd6c1;
}

.certificate-emission-v15{
    text-align:left;
}
.certificate-emission-v15 small{
    display:block;
    color:#8b969d;
    font-size:.5rem;
    font-weight:900;
    letter-spacing:.09em;
}
.certificate-emission-v15 time{
    display:block;
    margin-top:3px;
    color:#18364c;
    font-size:.72rem;
    font-weight:800;
}

.certificate-seal-v15{
    display:flex;
    align-items:center;
    gap:9px;
    padding:8px 12px;
    border:1px solid #d1bc7e;
    background:#fbf7ec;
}
.certificate-seal-v15>span{
    display:grid;
    place-items:center;
    width:30px;height:30px;
    border-radius:50%;
    background:#102d45;
    color:#f1d386;
    font-weight:1000;
}
.certificate-seal-v15 strong,
.certificate-seal-v15 small{
    display:block;
}
.certificate-seal-v15 strong{
    color:#16344b;
    font-size:.58rem;
    letter-spacing:.07em;
}
.certificate-seal-v15 small{
    color:#87939b;
    font-size:.5rem;
}

.certificate-signature-v15{
    text-align:right;
}
.certificate-signature-v15>span{
    display:block;
    width:150px;
    height:1px;
    margin:0 0 6px auto;
    background:#9ba4aa;
}
.certificate-signature-v15 strong,
.certificate-signature-v15 small{
    display:block;
}
.certificate-signature-v15 strong{
    color:#18364c;
    font-size:.68rem;
}
.certificate-signature-v15 small{
    color:#87939b;
    font-size:.52rem;
}

.certificate-toolbar-v15{
    display:flex;
    justify-content:center;
    gap:10px;
    flex-wrap:wrap;
    margin-top:14px;
}
.certificate-print-button-v15,
.certificate-restart-v15{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:10px 16px;
    border-radius:10px;
    cursor:pointer;
    font:inherit;
    font-size:.72rem;
    font-weight:900;
}
.certificate-print-button-v15{
    border:1px solid #d2b462;
    background:#c7a24f;
    color:#09131b;
}
.certificate-restart-v15{
    border:1px solid #3c5669;
    background:#091924;
    color:#e7f4fb;
}

.certificate-print-help-v15{
    position:fixed;
    inset:0;
    z-index:900;
    display:grid;
    place-items:center;
    padding:20px;
    background:rgba(2,7,11,.9);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:.18s ease;
}
#cert-print-help:checked ~ .certificate-shell-v15 + .certificate-print-help-v15{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
}
.certificate-print-help-v15>div{
    width:min(520px,100%);
    padding:26px;
    border:1px solid #536a7a;
    border-radius:18px;
    background:#0a1b27;
    box-shadow:0 28px 90px rgba(0,0,0,.65);
    text-align:center;
}
.certificate-print-modal-icon{
    margin:0 0 7px;
    font-size:2rem;
}
.certificate-print-help-v15 h3{
    margin:0 0 10px;
    color:#fff;
}
.certificate-print-help-v15 p{
    color:#c6d6df;
    line-height:1.5;
}
.certificate-print-help-v15 kbd{
    padding:2px 6px;
    border:1px solid #536b7b;
    border-radius:5px;
    background:#05111a;
    color:#fff;
}
.certificate-print-help-v15 label{
    display:inline-flex;
    margin-top:8px;
    padding:8px 13px;
    border:1px solid #547086;
    border-radius:8px;
    color:#fff;
    cursor:pointer;
    font-weight:900;
}

/* ---------------------------------------------------------
   NOMBRE DEL GANADOR: se reutiliza el campo real del perfil.
   El avatar queda completamente fuera del certificado.
   --------------------------------------------------------- */
body:has(input[name="l5-win"]:checked) .registro-overlay{
    z-index:810 !important;
    height:0 !important;
    min-height:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    pointer-events:none !important;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .perfil-persistente{
    position:static !important;
    display:block !important;
    height:0 !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .perfil-identidad{
    position:fixed !important;
    top:204px !important;
    left:50% !important;
    z-index:820 !important;
    display:block !important;
    width:min(760px,72vw) !important;
    transform:translateX(-50%) !important;
    pointer-events:none !important;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .avatar-preview{
    display:none !important;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .nombre-jugador{
    display:block !important;
    width:100% !important;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .nombre-jugador label,
body:has(input[name="l5-win"]:checked) .registro-overlay .paso-registro-mini{
    display:none !important;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .nombre-jugador input{
    width:100% !important;
    height:auto !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    color:#102d45 !important;
    font-family:Georgia,"Times New Roman",serif !important;
    font-size:clamp(1.7rem,3.4vw,2.7rem) !important;
    font-weight:700 !important;
    line-height:1.15 !important;
    text-align:center !important;
    text-transform:uppercase !important;
    pointer-events:none !important;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .editar-perfil-icon,
body:has(input[name="l5-win"]:checked) .registro-overlay .hud-compacto,
body:has(input[name="l5-win"]:checked) .registro-overlay .progreso-hud{
    display:none !important;
}

/* ---------------------------------------------------------
   IMPRESIÓN / PDF
   --------------------------------------------------------- */
@media print{
    @page{
        size:A4 landscape;
        margin:7mm;
    }

    html,body{
        background:#fff !important;
    }

    body>*:not(.registro-overlay):not(.game-shell){
        display:none !important;
    }

    .game-shell>*:not(#contenido-principal),
    #contenido-principal>*:not(.game-state-controls):not(.campania-v12),
    .campania-v12>*:not(.victory-screen-v15){
        display:none !important;
    }

    .victory-screen-v15{
        position:static !important;
        inset:auto !important;
        display:block !important;
        opacity:1 !important;
        visibility:visible !important;
        pointer-events:auto !important;
        overflow:visible !important;
        padding:0 !important;
        background:#fff !important;
    }

    .certificate-shell-v15{
        width:100% !important;
        margin:0 !important;
    }

    .certificate-paper-v15{
        min-height:0 !important;
        padding:8mm 10mm 7mm !important;
        border:1.2pt solid #aa8a3f !important;
        box-shadow:none !important;
        background:#fff !important;
        -webkit-print-color-adjust:exact;
        print-color-adjust:exact;
    }

    .certificate-paper-v15::after{
        inset:4mm !important;
    }

    .certificate-toolbar-v15,
    .certificate-print-help-v15{
        display:none !important;
    }

    /* Nombre: solo el campo del jugador, SIN AVATAR. */
    .registro-overlay{
        display:block !important;
        position:static !important;
        height:0 !important;
        min-height:0 !important;
        padding:0 !important;
        background:transparent !important;
        border:0 !important;
        box-shadow:none !important;
    }
    .registro-overlay .perfil-persistente{
        display:block !important;
        height:0 !important;
        min-height:0 !important;
        padding:0 !important;
        margin:0 !important;
        background:transparent !important;
        border:0 !important;
    }
    .registro-overlay .perfil-identidad{
        position:fixed !important;
        top:58mm !important;
        left:50% !important;
        width:180mm !important;
        transform:translateX(-50%) !important;
        display:block !important;
        z-index:999 !important;
    }
    .registro-overlay .avatar-preview{
        display:none !important;
    }
    .registro-overlay .nombre-jugador{
        display:block !important;
        width:100% !important;
    }
    .registro-overlay .nombre-jugador input{
        width:100% !important;
        color:#102d45 !important;
        background:transparent !important;
        border:0 !important;
        box-shadow:none !important;
        text-align:center !important;
        text-transform:uppercase !important;
        font-family:Georgia,"Times New Roman",serif !important;
        font-size:20pt !important;
        font-weight:700 !important;
    }
    .registro-overlay .editar-perfil-icon,
    .registro-overlay .hud-compacto,
    .registro-overlay .progreso-hud{
        display:none !important;
    }

    .certificate-verification-v15,
    .certificate-status-v15,
    .certificate-seal-v15,
    .certificate-brand-mark{
        -webkit-print-color-adjust:exact;
        print-color-adjust:exact;
    }
}

/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */
@media(max-width:900px){
    .certificate-paper-v15{
        padding:28px 24px 24px;
    }
    .certificate-summary-v15{
        grid-template-columns:1fr;
    }
    .certificate-verification-v15{
        max-width:230px;
        margin:0 auto;
    }
    body:has(input[name="l5-win"]:checked) .registro-overlay .perfil-identidad{
        top:222px !important;
        width:min(86vw,700px) !important;
    }
}

@media(max-width:680px){
    .certificate-header-v15{
        align-items:flex-start;
        flex-direction:column;
    }
    .level-score-grid-v15{
        grid-template-columns:repeat(5,minmax(74px,1fr));
        overflow-x:auto;
        padding-bottom:5px;
    }
    .certificate-main-metrics-v15{
        grid-template-columns:1fr 1fr;
    }
    .certificate-footer-v15{
        grid-template-columns:1fr;
        text-align:center;
    }
    .certificate-emission-v15,
    .certificate-signature-v15{
        text-align:center;
    }
    .certificate-signature-v15>span{
        margin-left:auto;
        margin-right:auto;
    }
    body:has(input[name="l5-win"]:checked) .registro-overlay .perfil-identidad{
        top:260px !important;
    }
    .certificate-name-slot-v15{
        height:92px;
    }
}

/* =========================================================
   V16 · AJUSTES FINALES
   1) Inicio de Nivel 1 flotante.
   2) Imprimir/Guardar PDF flotante.
   3) La impresión conserva el diseño visual del certificado.
   ========================================================= */

/* ---------------------------------------------------------
   BOTÓN INICIAR PARTIDA · NIVEL 1
   Flotante como los botones de ascenso.
   --------------------------------------------------------- */
.start-level-v11{
    position:fixed !important;
    left:50%;
    bottom:20px;
    z-index:210;
    width:min(520px,calc(100vw - 150px)) !important;
    min-height:58px !important;
    margin:0 !important;
    padding:12px 22px !important;
    transform:translateX(-50%);
    border:2px solid var(--cyan) !important;
    border-radius:16px !important;
    background:linear-gradient(135deg,#10354e,#0a263a 58%,#081f30) !important;
    color:#fff !important;
    box-shadow:
        0 18px 48px rgba(0,0,0,.45),
        0 0 30px rgba(55,216,255,.18);
    font-size:.9rem !important;
    font-weight:900 !important;
    letter-spacing:.04em;
    cursor:pointer;
    animation:startGamePulseV16 1.9s ease-in-out infinite;
}
.start-level-v11:hover{
    transform:translateX(-50%) translateY(-3px) !important;
    border-color:#fff !important;
    box-shadow:
        0 22px 58px rgba(0,0,0,.52),
        0 0 40px rgba(55,216,255,.34);
}
@keyframes startGamePulseV16{
    0%,100%{
        box-shadow:0 18px 48px rgba(0,0,0,.45),0 0 20px rgba(55,216,255,.11);
    }
    50%{
        box-shadow:0 18px 48px rgba(0,0,0,.48),0 0 34px rgba(55,216,255,.27);
    }
}

/* Dar aire abajo de la pantalla de reglas para que el botón flotante
   no tape el contenido. */
.primer-paso-info-inner{
    padding-bottom:105px !important;
}

/* ---------------------------------------------------------
   CERTIFICADO EN PANTALLA:
   eliminar cualquier resto visual del HUD detrás del nombre.
   El certificado NO muestra avatar.
   --------------------------------------------------------- */
body:has(input[name="l5-win"]:checked) .registro-overlay{
    position:fixed !important;
    inset:0 auto auto 0 !important;
    width:100% !important;
    height:0 !important;
    min-height:0 !important;
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
    background:transparent !important;
    backdrop-filter:none !important;
    box-shadow:none !important;
    overflow:visible !important;
    pointer-events:none !important;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .perfil-persistente{
    position:static !important;
    display:block !important;
    width:100% !important;
    max-width:none !important;
    height:0 !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .perfil-persistente > *:not(.perfil-identidad){
    display:none !important;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .perfil-identidad{
    position:fixed !important;
    top:202px !important;
    left:50% !important;
    z-index:820 !important;
    display:block !important;
    width:min(760px,72vw) !important;
    height:auto !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    transform:translateX(-50%) !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    pointer-events:none !important;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .perfil-identidad > *:not(.nombre-jugador){
    display:none !important;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .nombre-jugador{
    display:block !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
}
body:has(input[name="l5-win"]:checked) .registro-overlay .nombre-jugador input{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    outline:0 !important;
    appearance:none !important;
    background:none !important;
    background-color:transparent !important;
    box-shadow:none !important;
    color:#102d45 !important;
    font-family:Georgia,"Times New Roman",serif !important;
    font-size:clamp(1.7rem,3.4vw,2.7rem) !important;
    font-weight:700 !important;
    line-height:1.15 !important;
    text-align:center !important;
    text-transform:uppercase !important;
    pointer-events:none !important;
}

/* ---------------------------------------------------------
   BOTÓN IMPRIMIR / PDF FLOTANTE
   --------------------------------------------------------- */
.certificate-toolbar-v15{
    position:fixed !important;
    left:50%;
    bottom:18px;
    z-index:850;
    display:flex !important;
    align-items:center;
    justify-content:center;
    gap:10px;
    width:auto !important;
    margin:0 !important;
    padding:8px;
    transform:translateX(-50%);
    border:1px solid rgba(83,111,132,.45);
    border-radius:16px;
    background:rgba(4,12,19,.92);
    backdrop-filter:blur(14px);
    box-shadow:0 20px 55px rgba(0,0,0,.48);
}
.certificate-print-button-v15{
    min-height:52px !important;
    padding:11px 19px !important;
    border:2px solid #d2b462 !important;
    border-radius:12px !important;
    background:linear-gradient(135deg,#d4b45c,#b99038) !important;
    color:#08131b !important;
    box-shadow:0 0 26px rgba(210,180,98,.16);
    font-size:.76rem !important;
}
.certificate-print-button-v15:hover{
    transform:translateY(-2px);
    box-shadow:0 8px 28px rgba(0,0,0,.28),0 0 30px rgba(210,180,98,.28);
}
.certificate-restart-v15{
    min-height:52px !important;
    padding:11px 16px !important;
}

/* El certificado deja espacio visual para la barra flotante. */
.certificate-shell-v15{
    padding-bottom:82px;
}

/* =========================================================
   IMPRESIÓN V16
   Esta regla está deliberadamente AL FINAL del CSS.
   Corrige la estructura real: game-shell > form > main > campaña.
   Mantiene colores, bordes, tipografías, QR y distribución del
   certificado tal como se ve en pantalla.
   ========================================================= */
@media print{
    @page{
        size:A4 landscape;
        margin:5mm;
    }

    html,
    body{
        width:100% !important;
        min-width:0 !important;
        height:auto !important;
        min-height:0 !important;
        margin:0 !important;
        padding:0 !important;
        overflow:visible !important;
        background:#fff !important;
    }

    /* Ocultar visualmente todo, pero conservar la cadena de ancestros
       necesaria para renderizar el certificado. */
    body *{
        visibility:hidden !important;
    }

    /* Los ancestros reales del certificado NO pueden quedar display:none.
       Esta era la causa de la vista de impresión vacía. */
    .game-shell,
    .game-shell > .game-state-form,
    .game-state-form,
    #contenido-principal,
    .campania-v12,
    .victory-screen-v15,
    .certificate-shell-v15,
    .certificate-paper-v15{
        display:block !important;
    }

    .game-shell,
    .game-state-form,
    #contenido-principal,
    .campania-v12{
        position:static !important;
        width:100% !important;
        height:auto !important;
        min-height:0 !important;
        margin:0 !important;
        padding:0 !important;
        overflow:visible !important;
        background:transparent !important;
    }

    .victory-screen-v15,
    .victory-screen-v15 *{
        visibility:visible !important;
    }

    .victory-screen-v15{
        position:static !important;
        inset:auto !important;
        width:100% !important;
        height:auto !important;
        min-height:0 !important;
        margin:0 !important;
        padding:0 !important;
        overflow:visible !important;
        opacity:1 !important;
        visibility:visible !important;
        pointer-events:auto !important;
        background:transparent !important;
    }

    .certificate-shell-v15{
        width:100% !important;
        max-width:none !important;
        margin:0 !important;
        padding:0 !important;
    }

    /* MISMO DISEÑO QUE EN PANTALLA: no se reemplazan fondos ni
       se convierten las tarjetas en una hoja vacía. */
    .certificate-paper-v15{
        box-sizing:border-box !important;
        width:100% !important;
        max-width:none !important;
        min-height:0 !important;
        height:196mm !important;
        margin:0 !important;
        padding:7mm 9mm 6mm !important;
        overflow:hidden !important;
        border:1px solid #c9b783 !important;
        background:
            linear-gradient(rgba(255,255,255,.97),rgba(255,255,255,.97)),
            repeating-linear-gradient(0deg,transparent 0 18px,rgba(10,32,52,.025) 18px 19px) !important;
        color:#122638 !important;
        box-shadow:none !important;
        -webkit-print-color-adjust:exact !important;
        print-color-adjust:exact !important;
    }

    .certificate-paper-v15::before,
    .certificate-paper-v15::after,
    .certificate-paper-v15 *,
    .certificate-brand-mark,
    .certificate-status-v15,
    .certificate-seal-v15,
    .certificate-verification-v15{
        -webkit-print-color-adjust:exact !important;
        print-color-adjust:exact !important;
    }

    /* Compactación mínima solo para entrar completa en una hoja A4,
       conservando la misma composición visual. */
    .certificate-header-v15{
        padding-bottom:3mm !important;
    }
    .certificate-title-block-v15{
        margin:4mm auto 1.5mm !important;
    }
    .certificate-title-block-v15 h2{
        font-size:25pt !important;
        margin:1mm 0 1.5mm !important;
    }
    .certificate-statement-v15{
        margin:2.5mm auto 3mm !important;
    }
    .certificate-name-slot-v15{
        height:15mm !important;
    }
    .certificate-main-text-v15{
        font-size:9.5pt !important;
        line-height:1.35 !important;
        margin-top:1.5mm !important;
    }
    .certificate-scores-v15{
        margin-bottom:2.5mm !important;
    }
    .level-score-grid-v15 article{
        padding:2.5mm 2mm 2mm !important;
    }
    .level-score-grid-v15 strong{
        font-size:15pt !important;
    }
    .certificate-summary-v15{
        margin-top:2.5mm !important;
        gap:3mm !important;
    }
    .certificate-main-metrics-v15 article{
        min-height:21mm !important;
        padding:2.5mm !important;
    }
    .certificate-main-metrics-v15 strong{
        font-size:15pt !important;
    }
    .certificate-verification-v15{
        padding:2.3mm !important;
    }
    .qr-stack-v15{
        min-height:27mm !important;
    }
    .qr-stack-v15 .qr-variant img{
        width:27mm !important;
        height:27mm !important;
        border:1.2mm solid #fff !important;
    }
    .certificate-footer-v15{
        margin-top:3mm !important;
        padding-top:2.5mm !important;
    }

    /* Barra de botones: nunca se imprime. */
    .certificate-toolbar-v15,
    .certificate-print-help-v15,
    .byte-help-button,
    .byte-help-panel,
    .resource-button,
    .resource-panel,
    .navegacion-flotante,
    .menu-v8,
    .game-over-overlay,
    footer{
        display:none !important;
        visibility:hidden !important;
    }

    /* Nombre real del ganador.
       Se conserva únicamente el INPUT del nombre; avatar, engranaje y HUD
       desaparecen por completo de la impresión. */
    .registro-overlay,
    .registro-overlay .perfil-persistente,
    .registro-overlay .perfil-identidad,
    .registro-overlay .nombre-jugador,
    .registro-overlay .nombre-jugador input{
        display:block !important;
        visibility:visible !important;
    }

    .registro-overlay{
        position:static !important;
        width:0 !important;
        height:0 !important;
        min-height:0 !important;
        margin:0 !important;
        padding:0 !important;
        border:0 !important;
        background:transparent !important;
        box-shadow:none !important;
        overflow:visible !important;
    }

    .registro-overlay .perfil-persistente{
        position:static !important;
        width:0 !important;
        height:0 !important;
        min-height:0 !important;
        margin:0 !important;
        padding:0 !important;
        border:0 !important;
        background:transparent !important;
        box-shadow:none !important;
    }

    .registro-overlay .perfil-identidad{
        position:fixed !important;
        top:55mm !important;
        left:50% !important;
        z-index:999 !important;
        width:165mm !important;
        height:auto !important;
        margin:0 !important;
        padding:0 !important;
        transform:translateX(-50%) !important;
        border:0 !important;
        background:transparent !important;
        box-shadow:none !important;
    }

    .registro-overlay .perfil-identidad > *:not(.nombre-jugador),
    .registro-overlay .avatar-preview,
    .registro-overlay .editar-perfil-icon,
    .registro-overlay .hud-compacto,
    .registro-overlay .progreso-hud{
        display:none !important;
        visibility:hidden !important;
    }

    .registro-overlay .nombre-jugador{
        width:100% !important;
        margin:0 !important;
        padding:0 !important;
        border:0 !important;
        background:transparent !important;
        box-shadow:none !important;
    }

    .registro-overlay .nombre-jugador label{
        display:none !important;
    }

    .registro-overlay .nombre-jugador input{
        width:100% !important;
        height:auto !important;
        min-width:0 !important;
        margin:0 !important;
        padding:0 !important;
        border:0 !important;
        outline:0 !important;
        border-radius:0 !important;
        appearance:none !important;
        background:transparent !important;
        box-shadow:none !important;
        color:#102d45 !important;
        font-family:Georgia,"Times New Roman",serif !important;
        font-size:20pt !important;
        font-weight:700 !important;
        line-height:1.1 !important;
        text-align:center !important;
        text-transform:uppercase !important;
        -webkit-print-color-adjust:exact !important;
        print-color-adjust:exact !important;
    }
}

/* ---------------------------------------------------------
   RESPONSIVE DE LOS BOTONES FLOTANTES
   --------------------------------------------------------- */
@media(max-width:680px){
    .start-level-v11{
        width:calc(100vw - 110px) !important;
        bottom:14px;
        min-height:52px !important;
        padding:10px 14px !important;
        font-size:.78rem !important;
    }

    .certificate-toolbar-v15{
        bottom:12px;
        width:calc(100vw - 24px) !important;
    }
    .certificate-print-button-v15{
        flex:1;
    }
    .certificate-restart-v15{
        flex:0 0 auto;
    }
}

/* =========================================================
   V17 · CORRECCIÓN DEFINITIVA DEL NOMBRE EN EL CERTIFICADO
   Elimina la franja oscura y evita que el certificado se desplace
   por debajo de un nombre anclado a la ventana.
   ========================================================= */

/* -----------------------------------------------------------------
   CERTIFICADO: ocultar POR COMPLETO el HUD original.
   Estos selectores tienen mayor especificidad que las reglas antiguas
   porque incluyen #partida-activa + el estado de victoria.
   ----------------------------------------------------------------- */
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay{
    position:fixed !important;
    inset:0 !important;
    z-index:810 !important;
    width:100% !important;
    height:0 !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:none !important;
    background-color:transparent !important;
    background-image:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    box-shadow:none !important;
    filter:none !important;
    overflow:visible !important;
    pointer-events:none !important;
}

body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay::before,
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay::after,
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .perfil-persistente::before,
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .perfil-persistente::after,
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .perfil-identidad::before,
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .perfil-identidad::after,
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .nombre-jugador::before,
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .nombre-jugador::after{
    content:none !important;
    display:none !important;
}

body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .perfil-persistente{
    position:static !important;
    display:block !important;
    width:100% !important;
    max-width:none !important;
    height:0 !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:none !important;
    background-color:transparent !important;
    background-image:none !important;
    box-shadow:none !important;
    filter:none !important;
}

/* Solo se conserva el contenedor del nombre. Todo lo demás del HUD desaparece. */
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .perfil-persistente > *:not(.perfil-identidad),
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .avatar-preview,
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .editar-perfil-icon,
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .hud-compacto,
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .progreso-hud,
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .timer-state,
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .timer-track{
    display:none !important;
    visibility:hidden !important;
    opacity:0 !important;
}

/* El nombre queda exactamente sobre el espacio reservado del certificado.
   Como el certificado ya no tiene scroll interno, ambos permanecen unidos. */
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .perfil-identidad{
    position:fixed !important;
    top:203px !important;
    left:50% !important;
    z-index:825 !important;
    display:block !important;
    width:min(760px,72vw) !important;
    height:auto !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    transform:translateX(-50%) !important;
    border:0 !important;
    border-radius:0 !important;
    background:none !important;
    background-color:transparent !important;
    background-image:none !important;
    box-shadow:none !important;
    filter:none !important;
    overflow:visible !important;
    pointer-events:none !important;
}

body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .perfil-identidad > *:not(.nombre-jugador){
    display:none !important;
    visibility:hidden !important;
}

body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .nombre-jugador{
    display:block !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:none !important;
    background-color:transparent !important;
    background-image:none !important;
    box-shadow:none !important;
    filter:none !important;
    overflow:visible !important;
}

body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .nombre-jugador label,
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .paso-registro-mini{
    display:none !important;
}

/* ID directo = máxima prioridad frente al fondo oscuro del HUD. */
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) #nombre-jugador{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    height:auto !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    outline:0 !important;
    border-radius:0 !important;
    appearance:none !important;
    -webkit-appearance:none !important;
    background:none !important;
    background-color:transparent !important;
    background-image:none !important;
    box-shadow:none !important;
    filter:none !important;
    color:#102d45 !important;
    caret-color:transparent !important;
    font-family:Georgia,"Times New Roman",serif !important;
    font-size:clamp(1.7rem,3.4vw,2.7rem) !important;
    font-weight:700 !important;
    line-height:1.12 !important;
    letter-spacing:.01em !important;
    text-align:center !important;
    text-transform:uppercase !important;
    pointer-events:none !important;
}

/* -----------------------------------------------------------------
   EVITAR QUE EL CERTIFICADO SE MUEVA DEBAJO DEL NOMBRE
   La pantalla final se ajusta a la ventana y deja de tener scroll interno.
   ----------------------------------------------------------------- */
body:has(input[name="l5-win"]:checked) .victory-screen-v15{
    position:fixed !important;
    inset:0 !important;
    display:grid !important;
    place-items:start center !important;
    width:100vw !important;
    height:100vh !important;
    min-height:0 !important;
    padding:10px 12px 86px !important;
    overflow:hidden !important;
    overscroll-behavior:none !important;
}

body:has(input[name="l5-win"]:checked) .certificate-shell-v15{
    box-sizing:border-box !important;
    width:min(1120px,calc(100vw - 24px)) !important;
    height:calc(100vh - 96px) !important;
    max-height:760px !important;
    margin:0 auto !important;
    padding:0 !important;
    overflow:hidden !important;
}

body:has(input[name="l5-win"]:checked) .certificate-paper-v15{
    box-sizing:border-box !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:26px 34px 22px !important;
    overflow:hidden !important;
}

/* Compactación proporcional para que el certificado completo quepa en notebook
   sin necesidad de desplazarse. */
body:has(input[name="l5-win"]:checked) .certificate-header-v15{
    padding-bottom:12px !important;
}
body:has(input[name="l5-win"]:checked) .certificate-title-block-v15{
    margin:16px auto 5px !important;
}
body:has(input[name="l5-win"]:checked) .certificate-title-block-v15 h2{
    font-size:clamp(2rem,3.8vw,3.15rem) !important;
    margin:4px 0 6px !important;
}
body:has(input[name="l5-win"]:checked) .certificate-statement-v15{
    margin:10px auto 12px !important;
}
body:has(input[name="l5-win"]:checked) .certificate-name-slot-v15{
    height:57px !important;
}
body:has(input[name="l5-win"]:checked) .certificate-main-text-v15{
    margin-top:5px !important;
    font-size:.96rem !important;
    line-height:1.42 !important;
}
body:has(input[name="l5-win"]:checked) .certificate-scores-v15{
    margin-bottom:10px !important;
}
body:has(input[name="l5-win"]:checked) .level-score-grid-v15 article{
    padding:9px 8px 7px !important;
}
body:has(input[name="l5-win"]:checked) .level-score-grid-v15 strong{
    font-size:1.28rem !important;
}
body:has(input[name="l5-win"]:checked) .certificate-summary-v15{
    margin-top:8px !important;
    gap:10px !important;
}
body:has(input[name="l5-win"]:checked) .certificate-main-metrics-v15 article{
    min-height:83px !important;
    padding:8px !important;
}
body:has(input[name="l5-win"]:checked) .certificate-main-metrics-v15 strong{
    font-size:1.38rem !important;
}
body:has(input[name="l5-win"]:checked) .certificate-verification-v15{
    padding:8px !important;
}
body:has(input[name="l5-win"]:checked) .qr-stack-v15{
    min-height:105px !important;
}
body:has(input[name="l5-win"]:checked) .qr-stack-v15 .qr-variant img{
    width:103px !important;
    height:103px !important;
}
body:has(input[name="l5-win"]:checked) .certificate-footer-v15{
    margin-top:11px !important;
    padding-top:10px !important;
}

/* Ajuste del nombre a la nueva geometría del certificado. */
body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .perfil-identidad{
    top:177px !important;
}

/* Pantallas de notebook más bajas. */
@media(max-height:760px) and (min-width:760px){
    body:has(input[name="l5-win"]:checked) .victory-screen-v15{
        padding-top:6px !important;
        padding-bottom:76px !important;
    }
    body:has(input[name="l5-win"]:checked) .certificate-shell-v15{
        height:calc(100vh - 84px) !important;
    }
    body:has(input[name="l5-win"]:checked) .certificate-paper-v15{
        padding:18px 27px 16px !important;
    }
    body:has(input[name="l5-win"]:checked) .certificate-title-block-v15{
        margin-top:10px !important;
    }
    body:has(input[name="l5-win"]:checked) .certificate-name-slot-v15{
        height:49px !important;
    }
    body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .perfil-identidad{
        top:148px !important;
    }
}

/* -----------------------------------------------------------------
   IMPRESIÓN: misma corrección de especificidad.
   El nombre queda limpio y el HUD NO puede reaparecer.
   ----------------------------------------------------------------- */
@media print{
    body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay{
        position:static !important;
        inset:auto !important;
        width:0 !important;
        height:0 !important;
        min-height:0 !important;
        margin:0 !important;
        padding:0 !important;
        border:0 !important;
        background:none !important;
        background-color:transparent !important;
        background-image:none !important;
        box-shadow:none !important;
        backdrop-filter:none !important;
        overflow:visible !important;
    }

    body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .perfil-persistente > *:not(.perfil-identidad),
    body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .avatar-preview,
    body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .editar-perfil-icon,
    body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .hud-compacto,
    body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .progreso-hud{
        display:none !important;
        visibility:hidden !important;
        opacity:0 !important;
    }

    body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .perfil-identidad{
        position:fixed !important;
        top:55mm !important;
        left:50% !important;
        width:165mm !important;
        height:auto !important;
        margin:0 !important;
        padding:0 !important;
        transform:translateX(-50%) !important;
        border:0 !important;
        background:none !important;
        background-color:transparent !important;
        background-image:none !important;
        box-shadow:none !important;
    }

    body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) .registro-overlay .nombre-jugador{
        display:block !important;
        width:100% !important;
        height:auto !important;
        margin:0 !important;
        padding:0 !important;
        border:0 !important;
        background:none !important;
        background-color:transparent !important;
        background-image:none !important;
        box-shadow:none !important;
    }

    body:has(#partida-activa:checked):has(input[name="l5-win"]:checked) #nombre-jugador{
        display:block !important;
        width:100% !important;
        height:auto !important;
        margin:0 !important;
        padding:0 !important;
        border:0 !important;
        outline:0 !important;
        border-radius:0 !important;
        background:none !important;
        background-color:transparent !important;
        background-image:none !important;
        box-shadow:none !important;
        filter:none !important;
        color:#102d45 !important;
        font-family:Georgia,"Times New Roman",serif !important;
        font-size:20pt !important;
        font-weight:700 !important;
        line-height:1.1 !important;
        text-align:center !important;
        text-transform:uppercase !important;
    }
}

/* =========================================================
   V20 · Reducir movimiento sin romper los cronómetros
   La regla global de prefers-reduced-motion acorta TODAS las
   animaciones; los cronómetros no son decorativos: miden tiempo.
   ========================================================= */
@media (prefers-reduced-motion: reduce){
    .registro-overlay .timer-number,
    .registro-overlay .timer-fill,
    .certificate-timer{
        animation-duration:1500s !important;
    }
}