:root{ --agua:#00bfa5; --agua2:#00a896; --aguaLight:#e0f7f4; --primario:#00bfa5; --primario2:#00a896; --primarioLight:#e0f7f4; --gris:#546e7a; --grisClaro:#eceff1; --blanco:#ffffff; --bg:#f5f7f8; --card:#ffffff; --text:#263238; --borde:#e0e0e0; }
body.dark{--bg:#121a1e; --card:#1e2e33; --text:#e0f2f1; --borde:#2f4443; --grisClaro:#263a3d;}
.tema-ruta-pct{margin-left:auto;padding:3px 7px;border:1px solid color-mix(in srgb,var(--primario) 25%,var(--borde));border-radius:999px;background:var(--primarioLight);color:var(--primario2);font-size:9px;font-weight:950;white-space:nowrap}
body{margin:0;background-color:var(--bg);background-image:radial-gradient(circle at 1px 1px, color-mix(in srgb, var(--primario) 10%, transparent) 1px, transparent 0),linear-gradient(color-mix(in srgb, var(--primario) 3.5%, transparent) 1px, transparent 1px),linear-gradient(90deg, color-mix(in srgb, var(--primario) 3.5%, transparent) 1px, transparent 1px);background-size:40px 40px,40px 40px,40px 40px;color:var(--text);font-family:sans-serif;transition:0.3s}
/* Evita selección y copia casual del contenido de estudio en PC y celular. */
body,body *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
input,textarea,select,[contenteditable="true"]{-webkit-user-select:text!important;user-select:text!important;-webkit-touch-callout:default!important}
img{-webkit-user-drag:none;user-drag:none}
/* Desplazamiento tipo app: conserva el gesto táctil sin mostrar rieles. */
html,body,body *{-ms-overflow-style:none;scrollbar-width:none}
html::-webkit-scrollbar,body::-webkit-scrollbar,body *::-webkit-scrollbar{display:none;width:0!important;height:0!important;background:transparent}
#quiz,#pdfPanel,#marinerosPanel,#doctrinaPanel,#legislacionPanel,#culturaPanel,#perfilPanel,#simulacroPanel,#tomosPanel,#retosPanel{
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
body.dark{background-color:var(--bg);background-image:radial-gradient(circle at 1px 1px, color-mix(in srgb, var(--primario) 14%, transparent) 1px, transparent 0),linear-gradient(color-mix(in srgb, var(--primario) 5%, transparent) 1px, transparent 1px),linear-gradient(90deg, color-mix(in srgb, var(--primario) 5%, transparent) 1px, transparent 1px);}
/* Durante el cambio claro/oscuro todos los colores se actualizan en un solo
   cuadro. Evita que cada tarjeta anime por separado y reduzca el rendimiento. */
html.tema-cambio-rapido *,html.tema-cambio-rapido *::before,html.tema-cambio-rapido *::after{
  transition:none!important;
  animation-play-state:paused!important;
}
.top{background:var(--card);padding:12px 15px;display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid var(--primario);position:sticky;top:0;z-index:10}
.banner{background:linear-gradient(90deg,var(--primario),var(--primario2));margin:10px;border-radius:12px;padding:14px;display:flex;gap:12px;cursor:pointer;color:white}
.banner.activo{background:linear-gradient(90deg,#2e7d32,#43a047)!important}
.mod{background:var(--card);margin:0 10px 10px;border-radius:12px;padding:14px;display:flex;gap:12px;cursor:pointer;border:1px solid var(--borde)}
.ico{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:var(--primarioLight);color:var(--primario2)}
.progress{height:4px;background:var(--grisClaro);border-radius:10px;margin-top:8px;overflow:hidden}.progress div{height:100%;width:0%;background:var(--primario)}
#pay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0008;display:none;justify-content:center;align-items:center;z-index:100}
#pay>div{background:var(--card);padding:22px;border-radius:16px;width:85%;max-width:360px;text-align:center;border-top:4px solid var(--primario)}
#quiz{position:fixed;top:0;left:0;width:100%;height:100%;background-color:var(--bg);background-image:radial-gradient(circle at 1px 1px, color-mix(in srgb, var(--primario) 10%, transparent) 1px, transparent 0),linear-gradient(color-mix(in srgb, var(--primario) 3.5%, transparent) 1px, transparent 1px),linear-gradient(90deg, color-mix(in srgb, var(--primario) 3.5%, transparent) 1px, transparent 1px);background-size:40px 40px,40px 40px,40px 40px;z-index:50;display:none;box-sizing:border-box;overflow:auto;color:var(--text)}
body.dark #quiz{background-image:radial-gradient(circle at 1px 1px, color-mix(in srgb, var(--primario) 14%, transparent) 1px, transparent 0),linear-gradient(color-mix(in srgb, var(--primario) 5%, transparent) 1px, transparent 1px),linear-gradient(90deg, color-mix(in srgb, var(--primario) 5%, transparent) 1px, transparent 1px);}
.opt2{background:var(--card);border:1.8px solid var(--borde);padding:14px 16px;border-radius:14px;cursor:pointer;display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.35;color:var(--text)}
.opt2.sel{border-color:var(--primario)!important;background:var(--primarioLight)!important;box-shadow:0 0 0 2px var(--primarioLight)}
.opt2.ok2{border-color:#16a34a!important;background:#f0fdf4!important;color:#166534!important}
.opt2.bad2{border-color:#dc2626!important;background:#fef2f2!important;color:#991b1b!important}
.quiz-card{background:var(--card);border:1px solid var(--borde);border-radius:16px;padding:16px;box-shadow:0 1px 3px #0001;color:var(--text)}
.btn{background:var(--primario);color:white;border:0;padding:14px;width:100%;border-radius:10px;font-weight:bold;margin-top:10px;cursor:pointer}
#auth{position:fixed;top:0;left:0;width:100%;height:100%;background:radial-gradient(ellipse at 30% 20%, color-mix(in srgb, var(--primario) 30%, transparent) 0%, transparent 55%),radial-gradient(ellipse at 80% 80%, color-mix(in srgb, var(--primario2) 22%, transparent) 0%, transparent 55%),radial-gradient(ellipse at bottom, color-mix(in srgb, var(--primario2) 55%, #001a25) 0%, #00141e 100%);z-index:200;display:flex;justify-content:center;align-items:center;padding:20px;box-sizing:border-box}
#auth::before{content:"⚓";position:absolute;z-index:0;font-size:clamp(190px,30vw,390px);opacity:.16;color:white;top:50%;left:18%;transform:translate(-50%,-50%) rotate(-12deg);pointer-events:none;filter:drop-shadow(0 20px 28px rgba(0,0,0,.28));animation:anclaFlotante 4.8s ease-in-out infinite;}
#auth>.auth-box{position:relative;z-index:2;}
@keyframes anclaFlotante{0%,100%{transform:translate(-50%,-50%) rotate(-12deg) translateY(0)}50%{transform:translate(-50%,-50%) rotate(-9deg) translateY(-14px)}}
@media(max-width:700px){#auth::before{left:50%;top:18%;font-size:190px;opacity:.10}}
@media(prefers-reduced-motion:reduce){#auth::before{animation:none!important}}
#auth::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px);background-size:32px 32px;pointer-events:none;}
.auth-box{background:var(--card);padding:22px;border-radius:16px;width:100%;max-width:360px;border:1px solid var(--borde);text-align:center;box-shadow:0 20px 60px rgba(0,0,0,0.4), 0 0 0 1px color-mix(in srgb, var(--primario) 15%, transparent);border-top:4px solid var(--primario)}
.auth-box input{width:90%;padding:14px;margin:6px 0;border-radius:10px;border:1px solid var(--borde);background:var(--bg);color:var(--text)}
.tabs{display:flex;gap:8px;margin-bottom:15px}.tab{flex:1;padding:10px;border-radius:8px;border:1px solid var(--borde);background:var(--bg);color:var(--text);cursor:pointer;font-weight:bold}.tab.act{background:var(--primario);color:white;border-color:var(--primario)}
.switch{cursor:pointer;background:var(--grisClaro);border-radius:20px;padding:6px 12px;font-size:13px;border:1px solid var(--borde)}
.paleta{display:flex;gap:8px;justify-content:center;margin:10px 0}
.color-btn{width:32px;height:32px;border-radius:50%;cursor:pointer;border:3px solid var(--card);box-shadow:0 0 0 2px var(--borde);transition:0.2s}
.color-btn.act{box-shadow:0 0 0 2px var(--text);transform:scale(1.2)}
#resultado{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.4);display:none;justify-content:center;align-items:center;z-index:150;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
#resultado>div{background:var(--card);padding:22px;border-radius:16px;width:85%;max-width:360px;text-align:center;border-top:4px solid var(--primario);box-shadow:0 15px 40px rgba(0,0,0,0.3)}
.res-num{font-size:28px;font-weight:bold;margin:5px 0}
#pdfPanel,#marinerosPanel,#doctrinaPanel,#legislacionPanel,#culturaPanel,#perfilPanel,#simulacroPanel,#tomosPanel{position:fixed;top:0;left:0;width:100%;height:100%;background-color:var(--bg);background-image:radial-gradient(circle at 1px 1px, color-mix(in srgb, var(--primario) 10%, transparent) 1px, transparent 0),linear-gradient(color-mix(in srgb, var(--primario) 3.5%, transparent) 1px, transparent 1px),linear-gradient(90deg, color-mix(in srgb, var(--primario) 3.5%, transparent) 1px, transparent 1px);background-size:40px 40px,40px 40px,40px 40px;z-index:60;display:none;padding:15px;box-sizing:border-box;overflow:auto}
#retosPanel{
  position:fixed;inset:0;width:100%;height:100%;z-index:500;display:none;
  box-sizing:border-box;overflow:auto;color:var(--text);background-color:var(--bg);isolation:isolate;
  background:
    radial-gradient(circle at 12% 12%,color-mix(in srgb,var(--primario) 16%,transparent),transparent 24%),
    repeating-linear-gradient(0deg,color-mix(in srgb,var(--primario) 5%,transparent) 0 1px,transparent 1px 38px),
    repeating-linear-gradient(90deg,color-mix(in srgb,var(--primario) 5%,transparent) 0 1px,transparent 1px 38px),
    linear-gradient(145deg,color-mix(in srgb,var(--primarioLight) 26%,var(--bg)),var(--bg));
}
body.dark #retosPanel{
  background-color:var(--bg);
  background-image:
    radial-gradient(circle at 12% 12%,color-mix(in srgb,var(--primario) 19%,transparent),transparent 25%),
    radial-gradient(circle at 88% 85%,color-mix(in srgb,var(--primario2) 10%,transparent),transparent 30%),
    repeating-linear-gradient(0deg,color-mix(in srgb,var(--primario) 7%,transparent) 0 1px,transparent 1px 38px),
    repeating-linear-gradient(90deg,color-mix(in srgb,var(--primario) 7%,transparent) 0 1px,transparent 1px 38px),
    linear-gradient(145deg,#07151c,var(--bg) 48%,#0b2026);
  background-size:auto,auto,auto,auto,auto;
}
#retosPanel::before{
  content:none;
  display:none;
}
#retosPanel.reto-en-juego{
  background:
    radial-gradient(circle at 50% -10%,color-mix(in srgb,var(--primario) 28%,transparent),transparent 38%),
    radial-gradient(circle at 8% 78%,color-mix(in srgb,var(--primario2) 13%,transparent),transparent 28%),
    repeating-radial-gradient(ellipse at 50% 120%,transparent 0 34px,color-mix(in srgb,var(--primario) 7%,transparent) 35px 36px,transparent 37px 72px),
    linear-gradient(150deg,color-mix(in srgb,var(--primarioLight) 22%,var(--bg)),var(--bg));
}
body.dark #retosPanel.reto-en-juego{
  background:
    radial-gradient(circle at 50% -10%,color-mix(in srgb,var(--primario) 23%,transparent),transparent 38%),
    radial-gradient(circle at 8% 78%,color-mix(in srgb,var(--primario2) 16%,transparent),transparent 28%),
    repeating-radial-gradient(ellipse at 50% 120%,transparent 0 34px,color-mix(in srgb,var(--primario) 9%,transparent) 35px 36px,transparent 37px 72px),
    linear-gradient(150deg,#07151c,var(--bg));
}
body.retos-abierto>.top{display:none!important}
body.dark #pdfPanel,body.dark #marinerosPanel,body.dark #doctrinaPanel,body.dark #legislacionPanel,body.dark #culturaPanel,body.dark #perfilPanel,body.dark #simulacroPanel,body.dark #tomosPanel{background-image:radial-gradient(circle at 1px 1px, color-mix(in srgb, var(--primario) 14%, transparent) 1px, transparent 0),linear-gradient(color-mix(in srgb, var(--primario) 5%, transparent) 1px, transparent 1px),linear-gradient(90deg, color-mix(in srgb, var(--primario) 5%, transparent) 1px, transparent 1px);}
.pdf-box{background:var(--card);border:1px solid var(--borde);border-radius:12px;padding:16px;margin-top:15px}
.barra-rapida{background:var(--card);margin:10px;border-radius:12px;padding:10px 14px;display:flex;justify-content:space-between;align-items:center;border:1px solid var(--borde);border-left:4px solid var(--primario)}
#mejorarPanel{position:fixed;inset:0;width:100%;height:100%;background:rgba(0,0,0,0.58);display:none;justify-content:center;align-items:center;z-index:2500;padding:12px;box-sizing:border-box;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
#mejorarPanel>div{background:var(--card);width:100%;max-width:500px;max-height:90vh;overflow:auto;border-radius:16px;padding:18px;border:1px solid var(--borde)}
#mejorarPanel input, #mejorarPanel textarea{width:100%;box-sizing:border-box;padding:10px;margin:6px 0;border-radius:8px;border:1px solid var(--borde);background:var(--bg);color:var(--text);font-family:inherit}
.tomo-card{background:var(--card);border:1.5px solid var(--borde);border-left:5px solid var(--primario);border-radius:12px;padding:16px;margin-bottom:12px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:0.2s}
.tomo-card:hover{transform:translateX(4px);border-left-width:8px;box-shadow:0 4px 12px #0001}
@keyframes slideUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
#appAlert,#appConfirm{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.45);display:none;justify-content:center;align-items:flex-end;z-index:9999;padding:0;box-sizing:border-box;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
#appAlert>div,#appConfirm>div{animation:slideUp 0.35s cubic-bezier(0.16,1,0.3,1)}
/* MODAL AREA BONITO NUEVO */
#modalAreaProf{position:fixed;inset:0;background:rgba(0,0,0,0.5);display:none;justify-content:center;align-items:flex-end;z-index:9999;backdrop-filter:blur(6px)}
#modalAreaProf>div{animation:slideUp 0.35s cubic-bezier(0.16,1,0.3,1);background:var(--card);width:100%;max-width:420px;border-radius:24px 24px 0 0;padding:22px 16px 30px;border-top:4px solid var(--primario);max-height:85vh;overflow:auto}
.btnArea{width:100%;text-align:left;padding:14px 16px;border-radius:12px;border:1.5px solid var(--borde);background:var(--bg);color:var(--text);margin:6px 0;cursor:pointer;display:flex;justify-content:space-between;align-items:center;font-weight:600}
.btnArea.act{border-color:var(--primario);background:var(--primarioLight);color:var(--primario2)}

/* ===== ACADEMIA NAVAL UI 2.0 — CRISTAL MARINO ===== */
:root{
  --vidrio:rgba(255,255,255,.76);
  --vidrio-fuerte:rgba(255,255,255,.9);
  --sombra-marina:0 14px 34px rgba(4,38,58,.13);
  --brillo-marino:0 0 0 1px color-mix(in srgb,var(--primario) 14%,transparent),0 16px 38px rgba(3,43,65,.12);
}
body.dark{
  --vidrio:rgba(19,38,48,.76);
  --vidrio-fuerte:rgba(22,43,54,.9);
  --sombra-marina:0 16px 38px rgba(0,0,0,.32);
  --brillo-marino:0 0 0 1px color-mix(in srgb,var(--primario) 20%,transparent),0 18px 44px rgba(0,0,0,.3);
}
body{
  min-height:100vh;
  background:
    radial-gradient(circle at 16% 8%,color-mix(in srgb,var(--primario) 22%,transparent),transparent 28%),
    radial-gradient(circle at 88% 18%,color-mix(in srgb,var(--primario2) 15%,transparent),transparent 24%),
    linear-gradient(155deg,color-mix(in srgb,var(--primarioLight) 35%,var(--bg)) 0%,var(--bg) 42%,color-mix(in srgb,var(--primario) 7%,var(--bg)) 100%);
  background-attachment:fixed;
}
body::before{
  content:"";
  position:fixed;inset:0;pointer-events:none;z-index:-2;
  background:
    repeating-radial-gradient(ellipse at 50% 115%,transparent 0 30px,color-mix(in srgb,var(--primario) 7%,transparent) 31px 32px,transparent 33px 64px),
    linear-gradient(color-mix(in srgb,var(--primario) 3%,transparent) 1px,transparent 1px),
    linear-gradient(90deg,color-mix(in srgb,var(--primario) 3%,transparent) 1px,transparent 1px);
  background-size:180px 76px,48px 48px,48px 48px;
  animation:mareaSuave 18s linear infinite;
  opacity:.7;
}
body::after{
  content:"✥";
  position:fixed;right:-42px;top:78px;z-index:-1;
  font-size:220px;line-height:1;color:var(--primario);opacity:.035;
  transform:rotate(18deg);pointer-events:none;
}
body.dark::after{opacity:.06}
@keyframes mareaSuave{from{background-position:0 0,0 0,0 0}to{background-position:180px 0,48px 48px,48px 48px}}
@keyframes flotarTarjeta{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes brilloProgreso{0%{background-position:-180px 0}100%{background-position:180px 0}}
@keyframes pulsoCorrecto{0%{box-shadow:0 0 0 0 rgba(22,163,74,.0)}45%{box-shadow:0 0 0 9999px rgba(22,163,74,.09)}100%{box-shadow:0 0 0 9999px rgba(22,163,74,0)}}
@keyframes pulsoIncorrecto{0%{box-shadow:0 0 0 0 rgba(220,38,38,0)}45%{box-shadow:0 0 0 9999px rgba(220,38,38,.08)}100%{box-shadow:0 0 0 9999px rgba(220,38,38,0)}}

.top{
  margin:10px;
  top:10px;
  border:1px solid color-mix(in srgb,var(--primario) 20%,var(--borde));
  border-bottom:1px solid color-mix(in srgb,var(--primario) 20%,var(--borde));
  border-radius:18px;
  background:var(--vidrio-fuerte);
  backdrop-filter:blur(18px) saturate(145%);
  -webkit-backdrop-filter:blur(18px) saturate(145%);
  box-shadow:var(--brillo-marino);
}
.banner,.mod,.barra-rapida,.pdf-box,.quiz-card,.tomo-card{
  backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
}
.mod,.barra-rapida,.pdf-box,.quiz-card,.tomo-card{
  background:linear-gradient(145deg,var(--vidrio-fuerte),var(--vidrio));
  border:1px solid color-mix(in srgb,var(--primario) 16%,var(--borde));
  box-shadow:var(--sombra-marina);
}
.mod{
  border-radius:18px;
  position:relative;
  overflow:hidden;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.mod::after,.tomo-card::after,.quiz-card::after{
  content:"";
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(115deg,transparent 0 38%,rgba(255,255,255,.17) 48%,transparent 58%);
  transform:translateX(-120%);
  transition:transform .55s ease;
}
.mod:hover::after,.tomo-card:hover::after,.quiz-card:hover::after{transform:translateX(120%)}
.mod:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 38px color-mix(in srgb,var(--primario) 15%,rgba(0,0,0,.12));
  border-color:color-mix(in srgb,var(--primario) 34%,var(--borde));
}
.ico{
  border-radius:14px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--primarioLight) 92%,white),color-mix(in srgb,var(--primario) 16%,var(--card)));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 8px 20px color-mix(in srgb,var(--primario) 15%,transparent);
}
.progress{height:6px;background:color-mix(in srgb,var(--grisClaro) 80%,transparent)}
.progress div{
  border-radius:10px;
  background:linear-gradient(90deg,var(--primario),color-mix(in srgb,var(--primario) 65%,white),var(--primario2));
  background-size:180px 100%;
  animation:brilloProgreso 3.5s linear infinite;
  box-shadow:0 0 12px color-mix(in srgb,var(--primario) 40%,transparent);
}
.banner{
  border-radius:18px;
  box-shadow:0 16px 34px color-mix(in srgb,var(--primario) 28%,transparent);
  position:relative;overflow:hidden;
}
.banner::after{
  content:"≈";
  position:absolute;right:16px;bottom:-24px;font-size:82px;opacity:.15;transform:rotate(-8deg);
}
.color-btn{box-shadow:0 0 0 3px var(--vidrio-fuerte),0 0 0 5px color-mix(in srgb,var(--primario) 12%,var(--borde)),0 6px 14px rgba(0,0,0,.12)}
.btn,button{
  transition:transform .18s ease,filter .18s ease,box-shadow .18s ease;
}
.btn:hover,button:hover{filter:brightness(1.04);transform:translateY(-1px)}
.btn:active,button:active{transform:scale(.98)}

/* Carta náutica para Temas y paneles */
#pdfPanel,#marinerosPanel,#doctrinaPanel,#legislacionPanel,#culturaPanel,#perfilPanel,#simulacroPanel,#tomosPanel{
  background:
    radial-gradient(circle at 12% 12%,color-mix(in srgb,var(--primario) 16%,transparent),transparent 24%),
    repeating-linear-gradient(0deg,color-mix(in srgb,var(--primario) 5%,transparent) 0 1px,transparent 1px 38px),
    repeating-linear-gradient(90deg,color-mix(in srgb,var(--primario) 5%,transparent) 0 1px,transparent 1px 38px),
    linear-gradient(145deg,color-mix(in srgb,var(--primarioLight) 26%,var(--bg)),var(--bg));
}
body.dark #pdfPanel,body.dark #marinerosPanel,body.dark #doctrinaPanel,body.dark #legislacionPanel,
body.dark #culturaPanel,body.dark #perfilPanel,body.dark #simulacroPanel,body.dark #tomosPanel{
  background-color:var(--bg);
  background-image:
    radial-gradient(circle at 12% 12%,color-mix(in srgb,var(--primario) 19%,transparent),transparent 25%),
    radial-gradient(circle at 88% 85%,color-mix(in srgb,var(--primario2) 10%,transparent),transparent 30%),
    repeating-linear-gradient(0deg,color-mix(in srgb,var(--primario) 7%,transparent) 0 1px,transparent 1px 38px),
    repeating-linear-gradient(90deg,color-mix(in srgb,var(--primario) 7%,transparent) 0 1px,transparent 1px 38px),
    linear-gradient(145deg,#07151c,var(--bg) 48%,#0b2026);
  background-size:auto,auto,auto,auto,auto;
}
#pdfPanel::before,#marinerosPanel::before,#doctrinaPanel::before,#legislacionPanel::before,#culturaPanel::before,#perfilPanel::before,#simulacroPanel::before,#tomosPanel::before{
  content:"N   ✦   E";
  position:fixed;right:20px;top:62px;pointer-events:none;
  color:var(--primario);font-weight:900;letter-spacing:8px;opacity:.075;font-size:20px;
}
.tomo-card{
  border-left:5px solid var(--primario);
  position:relative;overflow:hidden;
}
.tomo-card:hover{transform:translateY(-3px) translateX(3px);box-shadow:var(--brillo-marino)}

/* Quiz inmersivo */
#quiz{
  background:
    radial-gradient(circle at 50% -10%,color-mix(in srgb,var(--primario) 28%,transparent),transparent 38%),
    radial-gradient(circle at 8% 78%,color-mix(in srgb,var(--primario2) 13%,transparent),transparent 28%),
    repeating-radial-gradient(ellipse at 50% 120%,transparent 0 34px,color-mix(in srgb,var(--primario) 7%,transparent) 35px 36px,transparent 37px 72px),
    linear-gradient(150deg,color-mix(in srgb,var(--primarioLight) 22%,var(--bg)),var(--bg));
}
body.dark #quiz{
  background:
    radial-gradient(circle at 50% -10%,color-mix(in srgb,var(--primario) 23%,transparent),transparent 36%),
    radial-gradient(circle at 8% 78%,color-mix(in srgb,var(--primario2) 15%,transparent),transparent 27%),
    repeating-radial-gradient(ellipse at 50% 120%,transparent 0 34px,color-mix(in srgb,var(--primario) 9%,transparent) 35px 36px,transparent 37px 72px),
    linear-gradient(150deg,#07131b,var(--bg));
}
.quiz-card{
  border-radius:22px;
  position:relative;overflow:hidden;
  box-shadow:0 22px 50px rgba(3,39,59,.14);
}
.opt2{
  border-radius:16px;
  background:linear-gradient(145deg,var(--vidrio-fuerte),var(--vidrio));
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  box-shadow:0 8px 20px rgba(3,39,59,.08);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.opt2:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--primario) 38%,var(--borde));box-shadow:0 14px 28px color-mix(in srgb,var(--primario) 12%,rgba(0,0,0,.08))}
.opt2.ok2{animation:pulsoCorrecto .65s ease}
.opt2.bad2{animation:pulsoIncorrecto .65s ease}

/* Resultado, modales y autenticación */
#resultado>div,#pay>div,.auth-box,#mejorarPanel>div{
  background:linear-gradient(145deg,var(--vidrio-fuerte),var(--vidrio));
  backdrop-filter:blur(22px) saturate(150%);
  -webkit-backdrop-filter:blur(22px) saturate(150%);
  box-shadow:0 24px 60px rgba(0,0,0,.28);
}
@media(max-width:640px){
  body::after{font-size:150px;right:-45px;top:105px}
  .top{margin:7px;top:7px;border-radius:15px}
  .mod{border-radius:15px}
  .quiz-card{border-radius:18px}
}
@media(prefers-reduced-motion:reduce){
  body::before,.progress div{animation:none!important}
  *,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important}
}


/* ===== LOGIN UI 2.1 — PORTAL NAVAL ===== */
#loginScreen,#authScreen,.login-screen,.auth-screen{
  min-height:100vh !important;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 18% 15%,color-mix(in srgb,var(--primario) 28%,transparent),transparent 30%),
    radial-gradient(circle at 82% 12%,color-mix(in srgb,var(--primario2) 18%,transparent),transparent 26%),
    repeating-radial-gradient(ellipse at 50% 115%,transparent 0 38px,color-mix(in srgb,var(--primario) 8%,transparent) 39px 40px,transparent 41px 80px),
    linear-gradient(150deg,color-mix(in srgb,var(--primarioLight) 38%,var(--bg)),var(--bg) 52%,color-mix(in srgb,var(--primario) 9%,var(--bg)));
}
#loginScreen::before,#authScreen::before,.login-screen::before,.auth-screen::before{
  content:"✥";
  position:absolute;
  right:-30px;
  top:42px;
  font-size:245px;
  line-height:1;
  color:var(--primario);
  opacity:.055;
  transform:rotate(15deg);
  pointer-events:none;
}
#loginScreen::after,#authScreen::after,.login-screen::after,.auth-screen::after{
  content:"ACADEMIA NAVAL";
  position:absolute;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  font-size:11px;
  font-weight:900;
  letter-spacing:5px;
  color:var(--primario);
  opacity:.28;
  white-space:nowrap;
  pointer-events:none;
}
.auth-box,.login-box,#loginBox{
  position:relative;
  overflow:hidden;
  width:min(92%,430px);
  margin:auto;
  padding:28px !important;
  border-radius:26px !important;
  border:1px solid color-mix(in srgb,var(--primario) 26%,var(--borde)) !important;
  background:linear-gradient(145deg,var(--vidrio-fuerte),var(--vidrio)) !important;
  backdrop-filter:blur(24px) saturate(155%) !important;
  -webkit-backdrop-filter:blur(24px) saturate(155%) !important;
  box-shadow:
    0 26px 70px rgba(2,35,54,.22),
    inset 0 1px 0 rgba(255,255,255,.55),
    0 0 0 1px color-mix(in srgb,var(--primario) 10%,transparent) !important;
}
.auth-box::after,.login-box::after,#loginBox::after{
  content:"";
  position:absolute;
  inset:-40% -30%;
  pointer-events:none;
  background:linear-gradient(110deg,transparent 42%,rgba(255,255,255,.16) 50%,transparent 58%);
  transform:translateX(-45%) rotate(8deg);
  animation:brilloLogin 7s ease-in-out infinite;
}
@keyframes flotarLogin{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-5px) rotate(2deg)}}
@keyframes brilloLogin{0%,55%{transform:translateX(-55%) rotate(8deg)}100%{transform:translateX(55%) rotate(8deg)}}

.auth-box h1,.auth-box h2,.login-box h1,.login-box h2,#loginBox h1,#loginBox h2{
  color:var(--primario2);
  letter-spacing:.4px;
  margin-bottom:7px;
}
.auth-box p,.login-box p,#loginBox p{
  opacity:.72;
}
.auth-box input,.login-box input,#loginBox input{
  width:100%;
  box-sizing:border-box;
  padding:13px 14px !important;
  margin:7px 0 !important;
  border-radius:14px !important;
  border:1px solid color-mix(in srgb,var(--primario) 18%,var(--borde)) !important;
  background:color-mix(in srgb,var(--vidrio-fuerte) 88%,transparent) !important;
  color:var(--text) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28);
  outline:none;
  transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
.auth-box input:focus,.login-box input:focus,#loginBox input:focus{
  border-color:var(--primario) !important;
  box-shadow:
    0 0 0 4px color-mix(in srgb,var(--primario) 14%,transparent),
    inset 0 1px 0 rgba(255,255,255,.25);
  transform:translateY(-1px);
}
.auth-box button,.login-box button,#loginBox button{
  border-radius:14px !important;
  min-height:45px;
  font-weight:900 !important;
  letter-spacing:.25px;
  box-shadow:0 12px 26px color-mix(in srgb,var(--primario) 24%,transparent);
}
.auth-box .btn,.login-box .btn,#loginBox .btn{
  background:linear-gradient(135deg,var(--primario),color-mix(in srgb,var(--primario) 58%,var(--primario2))) !important;
}
.auth-box a,.login-box a,#loginBox a{
  color:var(--primario2) !important;
  font-weight:800;
}
body.dark .auth-box,body.dark .login-box,body.dark #loginBox{
  box-shadow:0 28px 75px rgba(0,0,0,.46),inset 0 1px 0 rgba(255,255,255,.08) !important;
}
body.dark #loginScreen::before,body.dark #authScreen::before,body.dark .login-screen::before,body.dark .auth-screen::before{
  opacity:.085;
}
@media(max-width:640px){
  .auth-box,.login-box,#loginBox{
    width:min(90%,390px);
    padding:23px 20px !important;
    border-radius:22px !important;
  }
  #loginScreen::before,#authScreen::before,.login-screen::before,.auth-screen::before{
    font-size:170px;right:-48px;top:80px;
  }
}


.logoFlotante{
display:flex;
justify-content:center;
align-items:center;
font-size:64px;
color:#fff;
opacity:.92;
margin:-6px auto 10px;
text-shadow:0 0 18px rgba(255,255,255,.18),0 0 28px rgba(0,191,165,.35);
animation:logoFlotar 4.8s ease-in-out infinite;
position:relative;
z-index:3;
}
@keyframes logoFlotar{
0%,100%{transform:translateY(0)}
50%{transform:translateY(-10px)}
}

/* ===== SUBTEMAS PREMIUM 3.0 ===== */
.subtemas-hero{
  position:relative;overflow:hidden;margin:14px 0 16px;padding:18px;
  border-radius:22px;color:white;
  background:linear-gradient(135deg,var(--primario),var(--primario2));
  box-shadow:0 18px 38px color-mix(in srgb,var(--primario) 28%,transparent);
}
.subtemas-hero::after{
  content:"✥";position:absolute;right:-22px;bottom:-48px;font-size:150px;
  opacity:.13;transform:rotate(18deg);pointer-events:none
}
.subtemas-hero h3{margin:0 0 4px;font-size:18px;position:relative;z-index:1}
.subtemas-hero p{margin:0;opacity:.87;font-size:12px;position:relative;z-index:1}
.subtemas-stats{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;
  margin-top:15px;position:relative;z-index:1
}
.subtema-stat{
  background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.2);
  border-radius:13px;padding:10px 6px;text-align:center;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)
}
.subtema-stat b{display:block;font-size:17px}
.subtema-stat small{font-size:9px;font-weight:800;letter-spacing:.35px;opacity:.9}
.subtemas-continuar{
  display:none;align-items:center;gap:11px;margin:0 0 14px;padding:13px 14px;
  border-radius:16px;background:linear-gradient(135deg,#ff8c00,#ffb300);
  color:white;box-shadow:0 12px 25px rgba(255,140,0,.23);cursor:pointer
}
.subtemas-continuar.visible{display:flex}
.subtemas-continuar .play{
  width:42px;height:42px;flex:0 0 42px;border-radius:13px;
  background:rgba(255,255,255,.22);display:flex;align-items:center;
  justify-content:center;font-size:20px
}
.subtemas-continuar .continuar-info{min-width:0;flex:1}
.subtemas-continuar b,.subtemas-continuar small{
  display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.subtemas-continuar small{opacity:.88;margin-top:2px}
.tomo-card.subtema-premium{
  min-height:116px;padding:15px 14px 14px 15px;border-radius:19px;
  align-items:flex-start;gap:12px;border-left-width:0!important;
  background:linear-gradient(145deg,var(--vidrio-fuerte),var(--vidrio));
}
.tomo-card.subtema-premium::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:5px;
  background:linear-gradient(180deg,var(--primario),var(--primario2))
}
.subtema-icono{
  width:48px;height:48px;flex:0 0 48px;border-radius:15px;
  display:flex;align-items:center;justify-content:center;font-size:23px;
  background:linear-gradient(145deg,var(--primarioLight),color-mix(in srgb,var(--primario) 18%,var(--card)));
  box-shadow:0 8px 18px color-mix(in srgb,var(--primario) 16%,transparent)
}
.subtema-contenido{flex:1;min-width:0}
.subtema-titulo{font-size:13px;line-height:1.3;color:var(--text)!important}
.subtema-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
.subtema-chip{
  padding:5px 7px;border-radius:9px;background:var(--grisClaro);
  border:1px solid var(--borde);font-size:9px;font-weight:800;white-space:nowrap
}
.subtema-chip.dificultad{color:var(--primario2);background:var(--primarioLight)}
.subtema-chip.dominado{color:#166534;background:#dcfce7;border-color:#86efac}
.subtema-chip.proceso{color:#9a3412;background:#ffedd5;border-color:#fdba74}
.subtema-progreso-linea{display:flex;justify-content:space-between;gap:8px;margin-top:9px}
.subtema-progreso-linea small{font-weight:800;font-size:10px;opacity:.72}
.subtema-premium .progress{margin-top:5px!important;height:7px}
.subtema-flecha{
  width:34px;height:34px;flex:0 0 34px;border-radius:11px;
  display:flex;align-items:center;justify-content:center;
  background:var(--primarioLight);color:var(--primario2)!important;
  font-size:20px;font-weight:bold
}
@media(max-width:520px){
  .subtemas-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tomo-card.subtema-premium{min-height:125px}
}


/* ===== BIBLIOTECA DE TOMOS PREMIUM 3.1 ===== */
.tomos-biblioteca-hero{
  position:relative;overflow:hidden;margin:14px 0 14px;padding:19px;
  border-radius:23px;color:white;
  background:linear-gradient(135deg,#073b5c,var(--primario),var(--primario2));
  box-shadow:0 20px 42px color-mix(in srgb,var(--primario) 28%,transparent)
}
.tomos-biblioteca-hero::after{
  content:"⚓";position:absolute;right:-15px;bottom:-45px;font-size:145px;
  opacity:.12;transform:rotate(-14deg);pointer-events:none
}
.tomos-biblioteca-hero h3{margin:0 0 5px;font-size:19px;position:relative;z-index:1}
.tomos-biblioteca-hero p{margin:0;font-size:12px;opacity:.88;position:relative;z-index:1}
.tomos-resumen{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;
  margin-top:15px;position:relative;z-index:1
}
.tomos-resumen-item{
  padding:10px 6px;text-align:center;border-radius:13px;
  background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.2);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)
}
.tomos-resumen-item b{display:block;font-size:17px}
.tomos-resumen-item small{font-size:8px;font-weight:900;letter-spacing:.45px}
.tomo-objetivo{
  display:flex;gap:11px;align-items:center;margin:0 0 14px;padding:13px 14px;
  border-radius:16px;background:linear-gradient(135deg,#ff8c00,#ffb300);
  color:white;box-shadow:0 12px 26px rgba(255,140,0,.23)
}
.tomo-objetivo-icono{
  width:43px;height:43px;flex:0 0 43px;border-radius:13px;
  display:flex;align-items:center;justify-content:center;font-size:22px;
  background:rgba(255,255,255,.2)
}
.tomo-libro-card{
  position:relative;overflow:hidden;display:block!important;
  min-height:190px;margin-bottom:14px;padding:0!important;border:0!important;
  border-radius:21px!important;background:linear-gradient(145deg,var(--vidrio-fuerte),var(--vidrio))!important;
  box-shadow:0 16px 34px rgba(3,39,59,.13)!important
}
.tomo-libro-card::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:8px;
  background:linear-gradient(180deg,var(--primario),var(--primario2))
}
.tomo-libro-card::after{
  content:attr(data-romano);position:absolute;right:-9px;top:-25px;
  font-family:Georgia,serif;font-size:112px;font-weight:900;
  color:var(--primario);opacity:.055;transform:none!important
}
.tomo-libro-cabecera{
  position:relative;z-index:2;display:flex;gap:12px;align-items:flex-start;
  padding:16px 16px 8px 20px
}
.tomo-portada{
  width:58px;height:74px;flex:0 0 58px;border-radius:7px 12px 12px 7px;
  color:white;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:linear-gradient(145deg,#073b5c,var(--primario2));
  box-shadow:inset 5px 0 rgba(255,255,255,.12),0 10px 22px rgba(3,39,59,.22);
  border:1px solid rgba(255,255,255,.18)
}
.tomo-portada span{font-size:9px;font-weight:900;letter-spacing:1px}
.tomo-portada b{font-size:22px;font-family:Georgia,serif;margin-top:3px}
.tomo-libro-info{min-width:0;flex:1}
.tomo-libro-info h4{margin:1px 0 4px;color:var(--primario2);font-size:15px}
.tomo-libro-info p{margin:0;font-size:11px;opacity:.67;line-height:1.4}
.tomo-etiquetas{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.tomo-etiqueta{
  padding:5px 7px;border-radius:9px;background:var(--grisClaro);
  border:1px solid var(--borde);font-size:9px;font-weight:850
}
.tomo-etiqueta.en-curso{background:#ffedd5;color:#9a3412;border-color:#fdba74}
.tomo-etiqueta.dominado{background:#dcfce7;color:#166534;border-color:#86efac}
.tomo-libro-cuerpo{position:relative;z-index:2;padding:4px 16px 15px 20px}
.tomo-progreso-cabecera{
  display:flex;justify-content:space-between;gap:8px;margin-bottom:5px;
  font-size:10px;font-weight:850
}
.tomo-libro-card .progress{height:8px;margin:0 0 11px}
.tomo-acciones{display:grid;grid-template-columns:1fr auto;gap:8px}
.tomo-continuar-btn{
  border:0;border-radius:12px;padding:10px 12px;cursor:pointer;
  background:linear-gradient(135deg,var(--primario),var(--primario2));
  color:white;font-weight:900;font-size:11px
}
.tomo-flecha-btn{
  width:40px;border:1px solid var(--borde);border-radius:12px;
  background:var(--primarioLight);color:var(--primario2);font-size:21px
}
.tomos-estudiar-todo{
  margin-top:16px;padding:16px;border-radius:18px;
  background:linear-gradient(145deg,var(--vidrio-fuerte),var(--vidrio));
  border:1px solid color-mix(in srgb,var(--primario) 20%,var(--borde));
  box-shadow:var(--sombra-marina)
}
.tomos-estudiar-todo small{display:block;margin:3px 0 10px;opacity:.67}
@media(max-width:520px){
  .tomos-resumen{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tomo-libro-card{min-height:205px}
}


/* ===== PORTADAS DE LIBRO NAVAL 4.0 ===== */
#tomosPanel{
  --libro-a:#0b5f8a;
  --libro-b:#06344f;
  --libro-acento:#d9af48;
}
#tomosPanel.tema-legislacion{
  --libro-a:#7a2432;
  --libro-b:#3d1018;
  --libro-acento:#e8c76a;
}
#tomosPanel.tema-doctrina{
  --libro-a:#315b47;
  --libro-b:#163326;
  --libro-acento:#c7a956;
}
#tomosPanel.tema-cultura{
  --libro-a:#60407c;
  --libro-b:#2f1e42;
  --libro-acento:#d7b7ef;
}
#listaTomos{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(270px,1fr));
  gap:18px;
}
.tomo-libro-card{
  min-height:260px!important;
  margin:0!important;
  overflow:visible!important;
  border-radius:12px 22px 22px 12px!important;
  background:
    linear-gradient(90deg,rgba(255,255,255,.09),transparent 10%),
    linear-gradient(145deg,var(--libro-a),var(--libro-b))!important;
  box-shadow:
    -5px 0 0 color-mix(in srgb,var(--libro-b) 82%,black),
    0 3px 0 rgba(255,255,255,.08) inset,
    0 20px 34px rgba(1,22,35,.26)!important;
  color:#fff;
  transform:translateY(0);
  transition:transform .22s ease,box-shadow .22s ease;
}
.tomo-libro-card:hover{
  transform:translateY(-5px) rotateX(1deg);
  box-shadow:
    -7px 0 0 color-mix(in srgb,var(--libro-b) 82%,black),
    0 3px 0 rgba(255,255,255,.08) inset,
    0 28px 44px rgba(1,22,35,.32)!important;
}
.tomo-libro-card::before{
  width:30px!important;
  background:
    linear-gradient(90deg,rgba(0,0,0,.25),rgba(255,255,255,.1),rgba(0,0,0,.2)),
    var(--libro-b)!important;
  border-radius:10px 0 0 10px;
  box-shadow:inset -2px 0 rgba(255,255,255,.12),4px 0 12px rgba(0,0,0,.22);
}
.tomo-libro-card::after{
  right:5px!important;
  top:-10px!important;
  font-size:138px!important;
  color:#fff!important;
  opacity:.055!important;
  font-family:Georgia,serif!important;
}
.tomo-libro-cabecera{
  padding:20px 18px 10px 45px!important;
}
.tomo-portada{
  width:74px!important;
  height:98px!important;
  flex-basis:74px!important;
  border-radius:5px 13px 13px 5px!important;
  background:
    radial-gradient(circle at 50% 36%,rgba(255,255,255,.16),transparent 28%),
    linear-gradient(145deg,color-mix(in srgb,var(--libro-a) 88%,white),var(--libro-b))!important;
  border:1px solid rgba(255,255,255,.28)!important;
  box-shadow:
    inset 7px 0 rgba(0,0,0,.18),
    inset 0 0 0 2px rgba(255,255,255,.06),
    0 12px 20px rgba(0,0,0,.28)!important;
  position:relative;
}
.tomo-portada::before{
  content:"⚓";
  position:absolute;
  top:12px;
  width:32px;
  height:32px;
  border:1px solid color-mix(in srgb,var(--libro-acento) 75%,white);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--libro-acento);
  font-size:15px;
}
.tomo-portada span{
  margin-top:35px;
  color:rgba(255,255,255,.82);
  font-size:8px!important;
}
.tomo-portada b{
  color:var(--libro-acento);
  font-size:24px!important;
  text-shadow:0 1px 2px rgba(0,0,0,.35);
}
.tomo-libro-info h4{
  margin-top:2px!important;
  color:#fff!important;
  font-family:Georgia,serif;
  font-size:18px!important;
  letter-spacing:.5px;
}
.tomo-libro-info p{
  color:rgba(255,255,255,.72);
  min-height:16px;
}
.tomo-etiqueta{
  color:#fff!important;
  background:rgba(255,255,255,.11)!important;
  border-color:rgba(255,255,255,.17)!important;
  backdrop-filter:blur(5px);
}
.tomo-etiqueta.en-curso{
  background:rgba(255,174,43,.22)!important;
  border-color:rgba(255,190,70,.55)!important;
}
.tomo-etiqueta.dominado{
  background:rgba(51,210,126,.2)!important;
  border-color:rgba(91,229,153,.5)!important;
}
.tomo-libro-cuerpo{
  padding:10px 18px 18px 45px!important;
  border-top:1px solid rgba(255,255,255,.1);
}
.tomo-progreso-cabecera{
  color:rgba(255,255,255,.86);
}
.tomo-libro-card .progress{
  background:rgba(0,0,0,.22)!important;
  border:1px solid rgba(255,255,255,.1);
}
.tomo-libro-card .progress div{
  background:linear-gradient(90deg,var(--libro-acento),#fff1a9)!important;
  box-shadow:0 0 10px color-mix(in srgb,var(--libro-acento) 55%,transparent);
}
.tomo-continuar-btn{
  color:#20303a!important;
  background:linear-gradient(135deg,var(--libro-acento),#f7e4a0)!important;
  box-shadow:0 8px 16px rgba(0,0,0,.17);
}
.tomo-flecha-btn{
  color:white!important;
  background:rgba(255,255,255,.1)!important;
  border-color:rgba(255,255,255,.2)!important;
}
.tomo-sello-naval{
  position:absolute;
  right:16px;
  bottom:58px;
  width:50px;
  height:50px;
  border:1px dashed rgba(255,255,255,.2);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:rgba(255,255,255,.2);
  font-size:22px;
  transform:rotate(-12deg);
  pointer-events:none;
}
.tomos-estudiar-todo{
  margin-top:22px!important;
}
@media(max-width:650px){
  #listaTomos{grid-template-columns:1fr}
  .tomo-libro-card{min-height:250px!important}
}


/* ===== PORTADAS NAVALES SENCILLAS 4.1 ===== */
#listaTomos{
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr))!important;
  gap:13px!important;
}
.tomo-libro-card{
  min-height:205px!important;
  border-radius:12px 18px 18px 12px!important;
  box-shadow:-3px 0 0 var(--libro-b),0 10px 22px rgba(1,22,35,.18)!important;
  transform:none!important;
}
.tomo-libro-card:hover{
  transform:translateY(-2px)!important;
  box-shadow:-3px 0 0 var(--libro-b),0 14px 25px rgba(1,22,35,.22)!important;
}
.tomo-libro-card::before{
  width:15px!important;
  box-shadow:inset -1px 0 rgba(255,255,255,.1)!important;
}
.tomo-libro-card::after{
  font-size:90px!important;
  top:-4px!important;
  right:8px!important;
  opacity:.04!important;
}
.tomo-libro-cabecera{
  padding:15px 14px 7px 27px!important;
  gap:10px!important;
}
.tomo-portada{
  width:52px!important;
  height:70px!important;
  flex-basis:52px!important;
  border-radius:5px 10px 10px 5px!important;
  box-shadow:inset 5px 0 rgba(0,0,0,.15),0 7px 12px rgba(0,0,0,.17)!important;
}
.tomo-portada::before{
  top:8px!important;
  width:24px!important;
  height:24px!important;
  font-size:12px!important;
}
.tomo-portada span{
  margin-top:29px!important;
  font-size:7px!important;
}
.tomo-portada b{
  font-size:18px!important;
  margin-top:1px!important;
}
.tomo-libro-info h4{
  font-size:15px!important;
  margin-bottom:3px!important;
}
.tomo-etiquetas{
  gap:5px!important;
  margin-top:6px!important;
}
.tomo-etiqueta{
  padding:4px 6px!important;
  font-size:8px!important;
  border-radius:7px!important;
}
.tomo-libro-cuerpo{
  padding:8px 14px 13px 27px!important;
}
.tomo-progreso-cabecera{
  margin-bottom:4px!important;
  font-size:9px!important;
}
.tomo-libro-card .progress{
  height:6px!important;
  margin-bottom:8px!important;
}
.tomo-continuar-btn{
  padding:8px 10px!important;
  border-radius:10px!important;
  font-size:10px!important;
  box-shadow:none!important;
}
.tomo-flecha-btn{
  width:34px!important;
  border-radius:10px!important;
}
.tomo-sello-naval{
  display:none!important;
}
.tomos-biblioteca-hero{
  padding:16px!important;
  border-radius:18px!important;
  box-shadow:0 12px 25px color-mix(in srgb,var(--primario) 20%,transparent)!important;
}
.tomos-biblioteca-hero::after{
  font-size:110px!important;
}
.tomos-resumen{
  margin-top:12px!important;
}
.tomo-objetivo{
  padding:11px 12px!important;
  border-radius:14px!important;
  box-shadow:0 8px 18px rgba(255,140,0,.18)!important;
}
.tomos-estudiar-todo{
  padding:13px!important;
  border-radius:15px!important;
}
@media(max-width:650px){
  .tomo-libro-card{min-height:200px!important}
}


/* ===== RESULTADOS COMPACTOS 7.0 ===== */
#resultado{padding:12px;box-sizing:border-box;background:rgba(1,20,32,.72)!important;align-items:center;justify-content:center}
#resultado .resultado-card{width:min(100%,430px)!important;max-width:430px!important;max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);padding:0!important;box-sizing:border-box;display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--borde)!important;border-top:0!important;border-radius:24px!important;background:var(--card)!important;box-shadow:0 28px 70px rgba(0,0,0,.38)!important;text-align:left!important}
.resultado-hero{flex:0 0 auto;display:grid;grid-template-columns:58px minmax(0,1fr) 82px;align-items:center;gap:12px;padding:20px 18px;color:#fff;background:linear-gradient(135deg,var(--primario),var(--primario2));position:relative;overflow:hidden}
.resultado-hero::after{content:"⚓";position:absolute;right:67px;bottom:-41px;font-size:105px;opacity:.08;transform:rotate(-12deg);pointer-events:none}
.resultado-icono{width:58px;height:58px;margin:0!important;border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:30px;background:rgba(255,255,255,.17)!important;border:1px solid rgba(255,255,255,.22);position:relative;z-index:1}
.resultado-encabezado{min-width:0;position:relative;z-index:1}.resultado-titulo{margin:0!important;color:#fff!important;font-size:20px;line-height:1.1}.resultado-subtitulo{display:block;margin:5px 0 0;color:#fff;opacity:.82;font-size:10px;font-weight:750;line-height:1.3}
.resultado-porcentaje{width:76px;height:76px;margin:0!important;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:24px!important;font-weight:950!important;color:#fff!important;background:rgba(0,0,0,.16)!important;border:4px solid rgba(255,255,255,.88);box-shadow:0 8px 20px rgba(0,0,0,.18);position:relative;z-index:1;box-sizing:border-box}
.resultado-cuerpo{flex:1 1 auto;min-height:0;overflow-y:auto;padding:14px 16px 11px;overscroll-behavior:contain}
.resultado-resumen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0!important}
.resultado-dato{padding:10px 4px;border-radius:14px;border:1px solid var(--borde);background:var(--grisClaro);text-align:center}
.resultado-dato span{display:inline;font-size:14px;margin-right:3px}.resultado-dato b{display:inline;font-size:18px}.resultado-dato small{display:block;margin-top:3px;font-size:7px;font-weight:900;letter-spacing:.45px;opacity:.68}
.resultado-dato.correctas b{color:#16803a}.resultado-dato.incorrectas b{color:#c62828}
.resultado-mensaje{min-height:0;margin:11px 2px 0;text-align:center;font-weight:800;font-size:12px;line-height:1.35}
.resultado-acciones{flex:0 0 auto;display:grid;gap:7px;padding:11px 16px 15px;border-top:1px solid var(--borde);background:var(--card);position:relative;z-index:5}
#resultado .resultado-acciones .btn{display:block;visibility:visible;opacity:1;width:100%;min-height:43px;margin:0!important;padding:11px 13px!important;border-radius:13px!important;font-size:11px;line-height:1.15}
#resultado #btnCompartirResultado{display:block!important;background:linear-gradient(135deg,#0891b2,#0369a1)!important;color:#fff!important}
#resultado .resultado-btn-falladas{background:linear-gradient(135deg,#e53935,#c62828)!important}
#resultado .resultado-btn-volver{background:transparent!important;color:var(--primario2)!important;border:1.5px solid var(--primario)!important}
@media(max-width:360px){.resultado-hero{grid-template-columns:48px minmax(0,1fr) 68px;padding:15px 13px;gap:9px}.resultado-icono{width:48px;height:48px;font-size:25px}.resultado-porcentaje{width:64px;height:64px;font-size:20px!important}.resultado-titulo{font-size:17px}.resultado-cuerpo{padding:11px 12px 9px}.resultado-acciones{padding:9px 12px 12px}}
@media(max-height:520px){.resultado-hero{padding-top:11px;padding-bottom:11px}.resultado-icono{width:46px;height:46px;font-size:24px}.resultado-porcentaje{width:60px;height:60px;font-size:19px!important}.resultado-cuerpo{padding-top:8px;padding-bottom:7px}.resultado-dato{padding:6px 3px}.resultado-mensaje{margin-top:6px}.resultado-acciones{padding-top:7px;padding-bottom:8px;gap:5px}#resultado .resultado-acciones .btn{min-height:36px;padding:8px!important}}


/* ===== CENTRO DE MANDO — SIMULACRO 6.0 ===== */
#simulacroPanel{padding:0!important}
.simulacro-contenedor{width:min(100%,980px);margin:0 auto;padding:18px;box-sizing:border-box}
.simulacro-volver{background:var(--vidrio-fuerte);color:var(--text);border:1px solid var(--borde);padding:9px 14px;border-radius:22px;font-weight:850;box-shadow:0 8px 18px rgba(3,39,59,.08)}
.simulacro-hero{position:relative;overflow:hidden;display:grid;grid-template-columns:auto 1fr auto;gap:15px;align-items:center;margin:15px 0;padding:22px;border-radius:24px;color:white;background:linear-gradient(135deg,#062f4a,#075985,var(--primario2));box-shadow:0 22px 45px rgba(3,39,59,.25)}
.simulacro-hero::after{content:"⚓";position:absolute;right:-24px;bottom:-52px;font-size:170px;opacity:.08;transform:rotate(-14deg)}
.simulacro-hero-icono{width:66px;height:66px;border-radius:20px;display:flex;align-items:center;justify-content:center;font-size:34px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(8px)}
.simulacro-etiqueta{display:block;font-size:9px;font-weight:950;letter-spacing:1.6px;opacity:.72;margin-bottom:4px}
.simulacro-hero h2{margin:0 0 5px;font-size:25px}
.simulacro-hero p{margin:0;max-width:560px;font-size:12px;line-height:1.45;opacity:.8}
.simulacro-estado{position:relative;z-index:1;padding:8px 11px;border-radius:20px;background:rgba(255,255,255,.12);font-size:9px;font-weight:900;letter-spacing:.5px;white-space:nowrap}
.simulacro-estado span{display:inline-block;width:8px;height:8px;border-radius:50%;background:#4ade80;margin-right:5px;box-shadow:0 0 12px #4ade80}
.simulacro-config{display:flex;align-items:center;gap:13px;padding:16px 17px;border-radius:18px;background:linear-gradient(145deg,var(--vidrio-fuerte),var(--vidrio));border:1px solid color-mix(in srgb,var(--primario) 18%,var(--borde));box-shadow:var(--sombra-marina)}
.simulacro-config-icono{width:45px;height:45px;flex:0 0 45px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:22px;background:var(--primarioLight)}
.simulacro-config-info{flex:1}.simulacro-config-info b,.simulacro-config-info small{display:block}.simulacro-config-info small{opacity:.62;margin-top:3px}
.simulacro-switch{position:relative;width:54px;height:30px;flex:0 0 54px}.simulacro-switch input{opacity:0;width:0;height:0}.simulacro-slider{position:absolute;inset:0;border-radius:20px;background:var(--grisClaro);border:1px solid var(--borde);cursor:pointer;transition:.25s}.simulacro-slider::before{content:"";position:absolute;width:22px;height:22px;left:3px;top:3px;border-radius:50%;background:white;box-shadow:0 3px 8px rgba(0,0,0,.22);transition:.25s}.simulacro-switch input:checked+.simulacro-slider{background:var(--primario)}.simulacro-switch input:checked+.simulacro-slider::before{transform:translateX(24px)}
.simulacro-seccion-titulo{display:flex;justify-content:space-between;align-items:end;gap:12px;margin:22px 2px 12px}.simulacro-seccion-titulo small{font-size:9px;font-weight:950;letter-spacing:1.3px;color:var(--primario2)}.simulacro-seccion-titulo h3{margin:3px 0 0}.simulacro-seccion-titulo>span{font-size:10px;opacity:.58}
.simulacro-opciones{display:grid;grid-template-columns:1.25fr .9fr;gap:14px}
.simulacro-opcion{position:relative;overflow:hidden;padding:19px;border-radius:22px;cursor:pointer;background:linear-gradient(145deg,var(--vidrio-fuerte),var(--vidrio));border:1px solid color-mix(in srgb,var(--primario) 17%,var(--borde));box-shadow:var(--sombra-marina);transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.simulacro-opcion:hover{transform:translateY(-4px);border-color:var(--primario);box-shadow:0 20px 40px color-mix(in srgb,var(--primario) 18%,rgba(0,0,0,.12))}
.simulacro-opcion-principal::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(#ef4444,#f59e0b)}
.simulacro-opcion-cabecera{display:flex;justify-content:space-between;align-items:center}
.simulacro-opcion-icono{width:52px;height:52px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:26px;background:var(--primarioLight)}
.simulacro-opcion-principal .simulacro-opcion-icono{background:#fff0e8}
.simulacro-insignia{padding:6px 8px;border-radius:9px;background:#fff0e8;color:#b45309;font-size:8px;font-weight:950;letter-spacing:.7px}.simulacro-insignia.suave{background:var(--primarioLight);color:var(--primario2)}
.simulacro-opcion h3{margin:14px 0 5px;font-size:19px;color:var(--primario2)}.simulacro-opcion p{margin:0 0 14px;font-size:11px;line-height:1.48;opacity:.65}
.simulacro-datos{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:11px}.simulacro-datos span{padding:9px 5px;text-align:center;border-radius:12px;background:var(--grisClaro);border:1px solid var(--borde)}.simulacro-datos b,.simulacro-datos small{display:block}.simulacro-datos b{font-size:18px;color:var(--primario2)}.simulacro-datos small{font-size:8px;font-weight:850;opacity:.65}
.simulacro-distribucion,.simulacro-materias{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}.simulacro-distribucion span,.simulacro-materias span{padding:6px 8px;border-radius:9px;background:var(--grisClaro);border:1px solid var(--borde);font-size:8px;font-weight:850}
.simulacro-reparto{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}
.simulacro-cantidad{display:flex;align-items:center;gap:8px;padding:8px 9px;border-radius:12px;background:var(--grisClaro);border:1px solid var(--borde)}
.simulacro-cantidad>span{font-size:17px}
.simulacro-cantidad label{flex:1;min-width:0;font-size:9px;font-weight:850;line-height:1.2}
.simulacro-cantidad input{width:48px;box-sizing:border-box;padding:7px 3px;border:1.5px solid var(--borde);border-radius:9px;background:var(--card);color:var(--text);font-weight:950;text-align:center;outline:none}
.simulacro-cantidad input:focus{border-color:var(--primario);box-shadow:0 0 0 2px var(--primarioLight)}
.simulacro-total{display:flex;justify-content:space-between;align-items:center;margin:0 0 12px;padding:9px 11px;border-radius:12px;background:var(--primarioLight);border:1px solid var(--primario);font-size:10px;font-weight:850;color:var(--primario2)}
.simulacro-total b{font-size:16px}.simulacro-total.invalido{background:#fef2f2;border-color:#ef4444;color:#b91c1c}
.simulacro-iniciar-btn{width:100%;border:0;padding:12px;border-radius:13px;color:#24313a;font-weight:950;font-size:10px;background:linear-gradient(135deg,#e9bd58,#fff0ad);box-shadow:0 10px 22px rgba(179,128,25,.18)}
.simulacro-iniciar-btn.secundario{color:white;background:linear-gradient(135deg,var(--primario),var(--primario2))}
.simulacro-aviso{display:flex;gap:11px;align-items:center;margin-top:14px;padding:13px 15px;border-radius:16px;background:color-mix(in srgb,var(--primarioLight) 60%,var(--card));border:1px solid color-mix(in srgb,var(--primario) 18%,var(--borde))}.simulacro-aviso>span{font-size:22px}.simulacro-aviso b,.simulacro-aviso small{display:block}.simulacro-aviso small{margin-top:2px;font-size:10px;opacity:.62}
@media(max-width:700px){.simulacro-hero{grid-template-columns:auto 1fr}.simulacro-estado{grid-column:1/-1;width:max-content}.simulacro-opciones{grid-template-columns:1fr}.simulacro-seccion-titulo{align-items:flex-start;flex-direction:column}.simulacro-seccion-titulo>span{margin-top:-5px}}
@media(max-width:430px){.simulacro-contenedor{padding:13px}.simulacro-hero{padding:18px 15px;gap:11px}.simulacro-hero-icono{width:53px;height:53px;font-size:27px}.simulacro-hero h2{font-size:21px}.simulacro-opcion{padding:16px}.simulacro-datos b{font-size:16px}}

/* ===== RETOS · FUEGO RÁPIDO ===== */
.retos-contenedor{width:min(100%,760px);margin:0 auto;padding:16px;box-sizing:border-box}
.retos-volver{padding:9px 14px;border-radius:22px;border:1px solid var(--borde);background:var(--card);color:var(--text);font-weight:850;cursor:pointer}
.retos-hero{position:relative;overflow:hidden;display:flex;align-items:center;gap:15px;margin:14px 0;padding:20px;border-radius:24px;color:#fff;background:linear-gradient(135deg,#3b0764,#6d28d9,#8b5cf6);box-shadow:0 20px 42px rgba(91,33,182,.28)}
.retos-hero::after{content:"🏆";position:absolute;right:-15px;bottom:-43px;font-size:130px;opacity:.1;transform:rotate(-12deg)}
.retos-hero-icono{width:58px;height:58px;flex:0 0 58px;border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:29px;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.2)}
.retos-hero>div{position:relative;z-index:1}.retos-hero small{font-size:9px;font-weight:950;letter-spacing:1.4px;opacity:.75}.retos-hero h2{margin:3px 0 4px}.retos-hero p{margin:0;font-size:11px;opacity:.84}
.fuego-card{padding:18px;border-radius:22px;background:linear-gradient(145deg,var(--vidrio-fuerte),var(--vidrio));border:1px solid color-mix(in srgb,#f97316 26%,var(--borde));box-shadow:var(--sombra-marina)}
.fuego-cabecera{display:flex;align-items:center;gap:12px}.fuego-icono{width:50px;height:50px;flex:0 0 50px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:25px;background:linear-gradient(145deg,#ffedd5,#fed7aa);box-shadow:0 8px 18px rgba(249,115,22,.2)}
.fuego-cabecera h3{margin:0 0 3px;color:#ea580c}.fuego-cabecera p{margin:0;font-size:10px;opacity:.65}
.fuego-reglas{display:flex;flex-wrap:wrap;gap:6px;margin:13px 0}.fuego-reglas span{padding:6px 8px;border-radius:9px;background:var(--grisClaro);border:1px solid var(--borde);font-size:8px;font-weight:850}
.fuego-titulo-materias{margin:16px 0 9px;font-size:10px;font-weight:950;letter-spacing:.8px;color:var(--primario2)}
.fuego-materias{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.fuego-materia{display:flex;align-items:center;gap:9px;padding:12px;border-radius:14px;border:1.5px solid var(--borde);background:var(--bg);color:var(--text);cursor:pointer;text-align:left;font-weight:850}
.fuego-materia span{font-size:21px}.fuego-materia small{display:block;margin-top:2px;font-size:8px;opacity:.58}.fuego-materia:hover{border-color:#f97316;transform:translateY(-2px);box-shadow:0 9px 20px rgba(249,115,22,.12)}
.fuego-juego{display:none}.fuego-barra{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:13px 0}.fuego-chip{padding:7px 9px;border-radius:11px;background:var(--card);border:1px solid var(--borde);font-size:9px;font-weight:900}.fuego-chip b{color:#ea580c}
.fuego-tiempo{position:relative;width:74px;height:74px;margin:3px auto 12px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:conic-gradient(#22c55e var(--fuego-tiempo,100%),var(--grisClaro) 0);box-shadow:0 10px 25px rgba(0,0,0,.12)}
.fuego-tiempo::before{content:"";position:absolute;inset:7px;border-radius:50%;background:var(--card)}.fuego-tiempo b{position:relative;z-index:1;font-size:27px}.fuego-tiempo.urgente{background:conic-gradient(#ef4444 var(--fuego-tiempo,25%),var(--grisClaro) 0);animation:fuegoPulso .55s ease-in-out infinite alternate}
@keyframes fuegoPulso{to{transform:scale(1.06);box-shadow:0 0 25px rgba(239,68,68,.38)}}
.fuego-pregunta{padding:17px;border-radius:18px;background:var(--card);border:1px solid var(--borde);box-shadow:var(--sombra-marina)}.fuego-pregunta h3{margin:0;font-size:16px;line-height:1.42;text-align:center}
.fuego-opciones{display:grid;gap:8px;margin-top:12px}.fuego-opcion{width:100%;padding:12px 13px;border-radius:13px;border:1.5px solid var(--borde);background:var(--bg);color:var(--text);font-weight:750;text-align:left;cursor:pointer}.fuego-opcion:hover{border-color:var(--primario)}.fuego-opcion.correcta{background:#dcfce7;border-color:#16a34a;color:#166534}.fuego-opcion.incorrecta{background:#fee2e2;border-color:#dc2626;color:#991b1b}
.fuego-mensaje{min-height:20px;margin-top:9px;text-align:center;font-size:10px;font-weight:900}
.fuego-resultado{display:none;padding:22px;border-radius:22px;text-align:center;background:var(--card);border:1px solid var(--borde);box-shadow:var(--sombra-marina)}.fuego-resultado-icono{font-size:46px}.fuego-resultado h2{margin:7px 0}.fuego-resultado-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:15px 0}.fuego-resultado-stats div{padding:11px 5px;border-radius:13px;background:var(--grisClaro);border:1px solid var(--borde)}.fuego-resultado-stats b,.fuego-resultado-stats small{display:block}.fuego-resultado-stats b{font-size:18px;color:#7c3aed}.fuego-resultado-stats small{font-size:8px;font-weight:850}
.fuego-resultado button{width:100%;padding:12px;border:0;border-radius:13px;background:linear-gradient(135deg,#7c3aed,#5b21b6);color:#fff;font-weight:900;cursor:pointer}
.fuego-resultado .reto-compartir{display:block!important;margin:0 0 8px;background:linear-gradient(135deg,#0891b2,#0369a1)!important;color:#fff!important}
.ultimo-card{margin-top:13px;border-color:color-mix(in srgb,#dc2626 28%,var(--borde))}
.ultimo-card .fuego-icono{background:linear-gradient(145deg,#fee2e2,#fecaca);box-shadow:0 8px 18px rgba(220,38,38,.2)}
.ultimo-card .fuego-cabecera h3{color:#b91c1c}
.ultimo-card .fuego-materia:hover{border-color:#dc2626;box-shadow:0 9px 20px rgba(220,38,38,.12)}
.ultimo-juego{display:none}.ultimo-vidas{display:flex;gap:4px;font-size:21px;letter-spacing:1px}.ultimo-vidas .perdida{filter:grayscale(1);opacity:.2}
.ultimo-tiempo{background:conic-gradient(#dc2626 var(--fuego-tiempo,100%),var(--grisClaro) 0)}
.ultimo-nivel{display:flex;justify-content:space-between;gap:8px;margin:0 0 10px;padding:9px 11px;border-radius:12px;background:#fef2f2;border:1px solid #fecaca;color:#991b1b;font-size:9px;font-weight:900}
.ultimo-progreso{height:7px;margin:10px 0 0;border-radius:10px;background:var(--grisClaro);overflow:hidden}.ultimo-progreso div{height:100%;width:0;background:linear-gradient(90deg,#f59e0b,#ef4444);transition:width .25s ease}
.ultimo-resultado{display:none}.ultimo-resultado button{background:linear-gradient(135deg,#dc2626,#991b1b)}
.infiltrado-card{margin-top:13px;border-color:color-mix(in srgb,#0891b2 30%,var(--borde))}
.infiltrado-card .fuego-icono{background:linear-gradient(145deg,#cffafe,#a5f3fc);box-shadow:0 8px 18px rgba(8,145,178,.2)}
.infiltrado-card .fuego-cabecera h3{color:#0e7490}.infiltrado-card .fuego-materia:hover{border-color:#0891b2;box-shadow:0 9px 20px rgba(8,145,178,.12)}
.infiltrado-juego{display:none}.infiltrado-tiempo{background:conic-gradient(#0891b2 var(--fuego-tiempo,100%),var(--grisClaro) 0)}
.infiltrado-instruccion{text-align:center;margin:0 0 11px;font-size:10px;font-weight:850;opacity:.68}
.infiltrado-expedientes{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.infiltrado-expediente{position:relative;min-height:150px;padding:15px;border-radius:15px;border:1.5px solid var(--borde);background:var(--card);color:var(--text);text-align:left;cursor:pointer;box-shadow:0 7px 17px rgba(0,0,0,.06)}
.infiltrado-expediente:hover{border-color:#0891b2;transform:translateY(-2px)}
.infiltrado-expediente b{display:block;margin-bottom:8px;font-size:12px;line-height:1.4;color:#0e7490}.infiltrado-expediente span{display:block;font-size:13px;line-height:1.5;opacity:.94;font-weight:550;padding-bottom:10px}
.infiltrado-expediente::after{content:"EXPEDIENTE";position:absolute;right:9px;bottom:7px;font-size:8px;font-weight:950;letter-spacing:1.15px;opacity:.42}
.infiltrado-expediente.correcta{background:#dcfce7;border-color:#16a34a}.infiltrado-expediente.incorrecta{background:#fee2e2;border-color:#dc2626}
.infiltrado-resultado{display:none}.infiltrado-resultado button{background:linear-gradient(135deg,#0891b2,#0e7490)}
@media(max-width:460px){.retos-contenedor{padding:12px}.retos-hero{padding:16px}.fuego-card{padding:14px}.fuego-materias{grid-template-columns:1fr}.fuego-pregunta{padding:14px}}
@media(max-width:560px){.infiltrado-expedientes{grid-template-columns:1fr}.infiltrado-expediente{min-height:125px;padding:16px}.infiltrado-expediente b{font-size:13px}.infiltrado-expediente span{font-size:14px;line-height:1.52}}



/* ===== TEMAS PRINCIPALES — ESTILO RUTA DE SUBTEMAS 6.1 ===== */
.mod.tema-ruta{
  --tema-a:var(--primario);
  --tema-b:var(--primario2);
  position:relative;
  overflow:hidden;
  min-height:40px;
  padding:14px;
  gap:12px;
  border:1px solid color-mix(in srgb,var(--tema-a) 24%,var(--borde));
  background:
    linear-gradient(145deg,color-mix(in srgb,var(--tema-a) 7%,var(--vidrio-fuerte)),var(--vidrio));
  box-shadow:0 11px 24px color-mix(in srgb,var(--tema-a) 12%,transparent);
}
.mod.tema-ruta::before{
  content:"";
  position:absolute;left:0;top:0;bottom:0;width:5px;
  background:linear-gradient(180deg,var(--tema-a),var(--tema-b));
}
.mod.tema-ruta::after{
  content:"";
  position:absolute;right:-18px;bottom:-34px;width:90px;height:90px;
  border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--tema-a) 14%,transparent),transparent 68%);
  transform:none;
}
.mod.tema-ruta:hover::after{transform:none}
.mod.tema-ruta .ico{
  width:40px;height:40px;flex:0 0 40px;
  position:relative;z-index:1;
  background:linear-gradient(145deg,color-mix(in srgb,var(--tema-a) 18%,var(--card)),color-mix(in srgb,var(--tema-a) 8%,var(--primarioLight)));
  color:var(--tema-b);
  box-shadow:0 7px 16px color-mix(in srgb,var(--tema-a) 17%,transparent);
}
.mod.tema-ruta .tema-ruta-info{flex:1;min-width:0;position:relative;z-index:1}
.mod.tema-ruta .tema-ruta-titulo{display:block;font-size:13px;line-height:1.2;color:var(--text)}
.mod.tema-ruta .tema-ruta-meta{display:flex;align-items:center;gap:6px;margin-top:4px;min-width:0}
.mod.tema-ruta .tema-ruta-dato{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:9px;font-weight:850;letter-spacing:.25px;opacity:.68
}
.mod.tema-ruta .tema-ruta-chip{
  flex:0 0 auto;padding:3px 6px;border-radius:8px;
  font-size:8px;font-weight:900;letter-spacing:.25px;
  color:var(--tema-b);background:color-mix(in srgb,var(--tema-a) 11%,var(--card));
  border:1px solid color-mix(in srgb,var(--tema-a) 22%,var(--borde));
}
.mod.tema-ruta .progress{height:5px;margin-top:7px;position:relative;z-index:1}
.mod.tema-ruta .progress div{background:linear-gradient(90deg,var(--tema-a),var(--tema-b))}
.mod.tema-ruta .tema-ruta-flecha{
  width:30px;height:30px;flex:0 0 30px;position:relative;z-index:1;
  display:flex;align-items:center;justify-content:center;border-radius:10px;
  color:var(--tema-b);background:color-mix(in srgb,var(--tema-a) 11%,var(--card));
  border:1px solid color-mix(in srgb,var(--tema-a) 20%,var(--borde));
  font-size:19px;font-weight:900;
}
.mod.tema-marineros{--tema-a:#008eaa;--tema-b:#006b87}
.mod.tema-especificos{--tema-a:#7e57c2;--tema-b:#5e35b1}
.mod.tema-legislacion{--tema-a:#b23a48;--tema-b:#7f1d2d}
.mod.tema-doctrina{--tema-a:#3f7d5a;--tema-b:#28543b}
.mod.tema-cultura{--tema-a:#ba7a20;--tema-b:#8a5510}
body.dark .mod.tema-ruta{
  background:linear-gradient(145deg,color-mix(in srgb,var(--tema-a) 13%,var(--card)),var(--vidrio));
}
@media(max-width:520px){
  .mod.tema-ruta{padding:14px;gap:12px}
  .mod.tema-ruta .tema-ruta-chip{padding:3px 5px}
}



/* ===== ACCESOS PRINCIPALES ESTILO SUBTEMAS 6.2 ===== */
.accion-ruta{
  --accion-a:var(--primario);
  --accion-b:var(--primario2);
  position:relative;
  overflow:hidden;
  box-sizing:border-box;
  min-height:68px;
  margin:0 10px 10px;
  padding:14px;
  display:flex;
  align-items:center;
  gap:12px;
  border:1px solid color-mix(in srgb,var(--accion-a) 24%,var(--borde));
  border-left:0!important;
  border-radius:16px;
  color:var(--text);
  background:linear-gradient(145deg,color-mix(in srgb,var(--accion-a) 8%,var(--card)),var(--vidrio));
  box-shadow:0 10px 24px color-mix(in srgb,var(--accion-a) 12%,transparent);
  cursor:pointer;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.accion-ruta::before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;
  width:5px;
  background:linear-gradient(180deg,var(--accion-a),var(--accion-b));
}
.accion-ruta::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(115deg,transparent 0 40%,rgba(255,255,255,.16) 49%,transparent 58%);
  transform:translateX(-120%);
  transition:transform .55s ease;
}
.accion-ruta:hover{transform:translateY(-2px);box-shadow:0 15px 30px color-mix(in srgb,var(--accion-a) 17%,transparent)}
.accion-ruta:hover::after{transform:translateX(120%)}
.accion-ruta-icono{
  width:42px;height:42px;flex:0 0 42px;
  border-radius:13px;
  display:flex;align-items:center;justify-content:center;
  font-size:21px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--accion-a) 14%,var(--card)),color-mix(in srgb,var(--accion-a) 24%,var(--card)));
  color:var(--accion-b);
  box-shadow:0 7px 16px color-mix(in srgb,var(--accion-a) 18%,transparent);
  position:relative;z-index:1;
}
.accion-ruta-info{flex:1;min-width:0;position:relative;z-index:1}
.accion-ruta-titulo{display:block;font-size:13px;line-height:1.25;color:var(--text)}
.accion-ruta-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:5px}
.accion-ruta-dato{font-size:10px;opacity:.65;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.accion-ruta-chip{
  padding:4px 6px;border-radius:8px;
  font-size:8px;font-weight:900;letter-spacing:.35px;
  color:var(--accion-b);
  background:color-mix(in srgb,var(--accion-a) 12%,var(--card));
  border:1px solid color-mix(in srgb,var(--accion-a) 27%,var(--borde));
  white-space:nowrap;
}
.accion-ruta-flecha{
  width:32px;height:32px;flex:0 0 32px;
  border-radius:10px;display:flex;align-items:center;justify-content:center;
  background:color-mix(in srgb,var(--accion-a) 12%,var(--card));
  color:var(--accion-b);font-size:20px;font-weight:900;
  position:relative;z-index:1;
}
.accion-ruta-simulacro{--accion-a:#ef4444;--accion-b:#b91c1c}
.acciones-duo{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:0 10px 10px;
}
.acciones-duo .accion-ruta{
  min-width:0;
  min-height:76px;
  margin:0;
  padding:11px 10px;
  gap:8px;
}
.acciones-duo .accion-ruta-icono{
  width:38px;height:38px;flex-basis:38px;
  border-radius:12px;
  font-size:19px;
}
.acciones-duo .accion-ruta-titulo{font-size:11px}
.acciones-duo .accion-ruta-meta{gap:4px;margin-top:4px}
.acciones-duo .accion-ruta-dato{font-size:8px}
.acciones-duo .accion-ruta-chip{padding:3px 5px;font-size:7px}
.acciones-duo .accion-ruta-flecha{
  width:25px;height:25px;flex-basis:25px;
  border-radius:8px;font-size:16px;
}
.accion-ruta-retos{
  --accion-a:#8b5cf6;
  --accion-b:#5b21b6;
  background:
    radial-gradient(circle at 86% 15%,rgba(255,255,255,.32),transparent 24%),
    linear-gradient(145deg,color-mix(in srgb,#8b5cf6 14%,var(--card)),var(--vidrio));
}
.accion-ruta-retos::before{background:linear-gradient(180deg,#a78bfa,#5b21b6)}
.accion-ruta-retos .accion-ruta-icono{
  color:#5b21b6;
  background:linear-gradient(145deg,#ede9fe,#ddd6fe);
  box-shadow:0 7px 18px rgba(109,40,217,.22);
}
.accion-ruta-retos .accion-ruta-chip{
  color:#6d28d9;
  background:#ede9fe;
  border-color:#c4b5fd;
}
.accion-ruta-membresia{--accion-a:#f59e0b;--accion-b:#b45309}
.accion-ruta-soporte{--accion-a:#0ea5e9;--accion-b:#0369a1;margin-top:15px;margin-bottom:25px}
#bannerMembresia.accion-ruta.activo{
  --accion-a:#22c55e;--accion-b:#15803d;
  background:linear-gradient(145deg,color-mix(in srgb,#22c55e 10%,var(--card)),var(--vidrio))!important;
}
.accion-ruta-soporte .accion-ruta-dato{font-size:9px}
.accion-ruta-boton{
  flex:0 0 auto;position:relative;z-index:2;
  min-height:34px;padding:8px 10px;border:0;border-radius:10px;
  background:linear-gradient(135deg,var(--accion-a),var(--accion-b));
  color:#fff;font-size:9px;font-weight:900;cursor:pointer;
  box-shadow:0 7px 15px color-mix(in srgb,var(--accion-a) 22%,transparent)
}
body.dark .accion-ruta{background:linear-gradient(145deg,color-mix(in srgb,var(--accion-a) 11%,var(--card)),var(--vidrio))}
@media(max-width:520px){
  .accion-ruta{min-height:68px;padding:13px;gap:10px}
  .accion-ruta-icono{width:40px;height:40px;flex-basis:40px}
  .accion-ruta-boton{padding:8px 9px}
  .acciones-duo{gap:7px}
  .acciones-duo .accion-ruta{min-height:74px;padding:10px 8px;gap:6px}
  .acciones-duo .accion-ruta-icono{width:34px;height:34px;flex-basis:34px;font-size:17px}
  .acciones-duo .accion-ruta-flecha{display:none}
}


/* ===== CONOCIMIENTOS ESPECÍFICOS — RUTA SUBTEMAS 6.3 ===== */
.especificos-wrap{width:min(100%,760px);margin:0 auto;padding-bottom:28px}.especificos-volver{background:var(--card);color:var(--text);border:1px solid var(--borde);padding:9px 14px;border-radius:20px;font-weight:850;cursor:pointer;box-shadow:0 8px 18px rgba(3,39,59,.08)}
.especificos-hero{position:relative;overflow:hidden;margin:14px 0;padding:19px;border-radius:22px;color:#fff;background:linear-gradient(135deg,#073b5c,var(--primario),var(--primario2));box-shadow:0 18px 38px color-mix(in srgb,var(--primario) 28%,transparent)}.especificos-hero::after{content:"⚓";position:absolute;right:-18px;bottom:-48px;font-size:145px;opacity:.12;transform:rotate(-13deg)}.especificos-hero-texto,.especificos-stats{position:relative;z-index:1}.especificos-kicker{display:block;font-size:9px;font-weight:950;letter-spacing:1.25px;opacity:.78}.especificos-hero h2{margin:4px 0 5px;font-size:21px}.especificos-hero p{margin:0;font-size:12px;line-height:1.45;opacity:.87}.especificos-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:15px}.especificos-stats div{padding:9px 5px;border-radius:13px;text-align:center;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(8px)}.especificos-stats b{display:block;font-size:16px}.especificos-stats small{font-size:8px;font-weight:900;letter-spacing:.5px}
.especificos-card{position:relative;display:flex;gap:12px;align-items:flex-start;margin:0 0 12px;padding:15px 14px 14px 15px;border-radius:19px;background:linear-gradient(145deg,var(--vidrio-fuerte),var(--vidrio));border:1px solid color-mix(in srgb,var(--primario) 17%,var(--borde));box-shadow:var(--sombra-marina);overflow:hidden}.especificos-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(180deg,var(--primario),var(--primario2))}.especificos-card-icono{width:48px;height:48px;flex:0 0 48px;border-radius:15px;display:flex;align-items:center;justify-content:center;font-size:23px;background:linear-gradient(145deg,var(--primarioLight),color-mix(in srgb,var(--primario) 18%,var(--card)));box-shadow:0 8px 18px color-mix(in srgb,var(--primario) 16%,transparent)}.especificos-card-cuerpo{flex:1;min-width:0}.especificos-card-titulo{display:flex;gap:8px;align-items:flex-start}.especificos-card-titulo>span{display:flex;width:22px;height:22px;flex:0 0 22px;border-radius:8px;align-items:center;justify-content:center;background:var(--primarioLight);color:var(--primario2);font-size:10px;font-weight:950}.especificos-card-titulo b,.especificos-card-titulo small{display:block}.especificos-card-titulo b{font-size:13px}.especificos-card-titulo small{font-size:10px;opacity:.65;margin-top:2px;line-height:1.35}
.especificos-file-input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.especificos-file-label,.especificos-selector{width:100%;box-sizing:border-box;margin-top:11px;padding:11px;border-radius:13px;border:1.5px solid color-mix(in srgb,var(--primario) 38%,var(--borde));background:var(--bg);color:var(--text);display:flex;align-items:center;gap:10px;cursor:pointer;text-align:left}.especificos-file-label>span:nth-child(2){flex:1;min-width:0}.especificos-file-label b,.especificos-file-label small{display:block}.especificos-file-label b{font-size:11px}.especificos-file-label small{font-size:9px;opacity:.62;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.especificos-file-ico{width:34px;height:34px;border-radius:11px;display:flex;align-items:center;justify-content:center;background:var(--primarioLight)}.especificos-flecha{margin-left:auto;color:var(--primario2);font-size:22px;font-weight:900}.especificos-input-linea{display:flex;align-items:center;gap:8px;margin-top:8px;padding:0 10px;border-radius:12px;border:1px solid var(--borde);background:var(--bg)}.especificos-input-linea input{width:100%;padding:11px 0;border:0;outline:0;background:transparent;color:var(--text)}.especificos-selector{font-weight:850;color:var(--primario2)}
.especificos-config{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:11px;padding:10px;border-radius:13px;background:var(--bg);border:1px solid var(--borde)}.especificos-config label{font-size:10px;font-weight:850}.especificos-numero{display:flex;align-items:center;gap:4px}.especificos-numero button{width:31px;height:31px;border:0;border-radius:9px;background:var(--primarioLight);color:var(--primario2);font-size:18px;font-weight:900}.especificos-numero input{width:50px;padding:7px 2px;text-align:center;border:1px solid var(--borde);border-radius:9px;background:var(--card);color:var(--text);font-weight:900}.especificos-nota{display:block;margin:7px 1px 0;font-size:9px;opacity:.6}.especificos-generar{width:100%;margin-top:11px;padding:11px 12px;border:0;border-radius:13px;background:linear-gradient(135deg,var(--primario),var(--primario2));color:#fff;display:flex;align-items:center;gap:10px;text-align:left;cursor:pointer;box-shadow:0 10px 22px color-mix(in srgb,var(--primario) 24%,transparent)}.especificos-generar div{flex:1}.especificos-generar b,.especificos-generar small{display:block}.especificos-generar b{font-size:11px}.especificos-generar small{font-size:9px;opacity:.82;margin-top:2px}.especificos-generar.listo{background:linear-gradient(135deg,#16834f,#22a865)}.especificos-log{font-size:11px;opacity:.72;margin:9px 0 0}.especificos-texto-preview{max-height:170px;overflow:auto;font-size:10px;line-height:1.5;background:var(--bg);padding:10px;border-radius:12px;margin-top:10px;white-space:pre-wrap;border:1px solid var(--borde)}
.especificos-guardadas{position:relative;overflow:hidden;margin-top:16px;padding:0 0 14px;border-radius:21px;background:linear-gradient(145deg,var(--vidrio-fuerte),var(--vidrio));border:1px solid color-mix(in srgb,#7e57c2 22%,var(--borde));box-shadow:var(--sombra-marina)}.guardadas-hero{position:relative;overflow:hidden;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px;color:#fff;background:linear-gradient(135deg,#55348c,#7e57c2,#9575cd)}.guardadas-hero::after{content:"★";position:absolute;right:66px;bottom:-45px;font-size:110px;opacity:.08;transform:rotate(-12deg)}.guardadas-hero>div{position:relative;z-index:1}.guardadas-hero h3{margin:3px 0 3px;font-size:17px}.guardadas-hero p{margin:0;font-size:10px;opacity:.82}.guardadas-contador{min-width:60px;padding:9px 7px;text-align:center;border-radius:13px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.2)}.guardadas-contador b{display:block;font-size:20px}.guardadas-contador small{font-size:7px;font-weight:900;letter-spacing:.5px}.guardadas-lista{display:flex;flex-direction:column;gap:8px;max-height:340px;overflow:auto;padding:12px 12px 2px}.guardada-item{position:relative;display:flex;gap:10px;align-items:flex-start;padding:11px;border-radius:15px;background:var(--bg);border:1px solid var(--borde)}.guardada-numero{width:30px;height:30px;flex:0 0 30px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:#ede9fe;color:#6d28d9;font-size:10px;font-weight:950}.guardada-contenido{flex:1;min-width:0}.guardada-contenido b{display:block;font-size:11px;line-height:1.4}.guardada-respuesta{display:flex;gap:5px;align-items:flex-start;margin-top:5px;font-size:9px;color:#166534}.guardada-eliminar{width:31px;height:31px;flex:0 0 31px;border:0;border-radius:10px;background:#fee2e2;color:#b91c1c;cursor:pointer;font-weight:900}.guardadas-vacio{padding:18px;text-align:center;border:1px dashed var(--borde);border-radius:14px;background:var(--bg)}.guardadas-vacio span{display:block;font-size:27px;margin-bottom:5px}.guardadas-vacio b,.guardadas-vacio small{display:block}.guardadas-vacio b{font-size:11px}.guardadas-vacio small{font-size:9px;opacity:.62;margin-top:3px}.guardadas-acciones{display:grid;grid-template-columns:1fr auto;gap:8px;padding:10px 12px 0}.guardadas-practicar,.guardadas-borrar{border:0;border-radius:12px;padding:11px;font-weight:900;font-size:9px;cursor:pointer}.guardadas-practicar{background:linear-gradient(135deg,#6d44af,#8e68c9);color:#fff}.guardadas-borrar{background:#fee2e2;color:#b91c1c}



/* ===== MI PERFIL 6.4 — ESTILO APP, PROPORCIONES ORIGINALES ===== */
#perfilPanel{
  background:
    radial-gradient(circle at 12% 10%,color-mix(in srgb,var(--primario) 18%,transparent),transparent 25%),
    repeating-linear-gradient(0deg,color-mix(in srgb,var(--primario) 4.5%,transparent) 0 1px,transparent 1px 38px),
    repeating-linear-gradient(90deg,color-mix(in srgb,var(--primario) 4.5%,transparent) 0 1px,transparent 1px 38px),
    linear-gradient(145deg,color-mix(in srgb,var(--primarioLight) 28%,var(--bg)),var(--bg))!important;
}
#perfilPanel>button:first-child{
  background:linear-gradient(145deg,var(--vidrio-fuerte),var(--vidrio))!important;
  border-color:color-mix(in srgb,var(--primario) 24%,var(--borde))!important;
  box-shadow:0 7px 18px rgba(3,39,59,.10)!important;
  color:var(--primario2)!important;
}
#perfilPanel>h2{
  position:relative;
  color:var(--primario2)!important;
  text-shadow:0 1px 0 rgba(255,255,255,.35);
}
#perfilPanel>h2::after{
  content:"CENTRO DE IDENTIDAD NAVAL";
  display:block;
  font-size:9px;
  letter-spacing:1.4px;
  font-weight:900;
  opacity:.48;
  margin-top:3px;
}
#perfilPanel .pdf-box{
  position:relative;
  overflow:hidden;
  background:linear-gradient(145deg,var(--vidrio-fuerte),var(--vidrio))!important;
  border-color:color-mix(in srgb,var(--primario) 19%,var(--borde))!important;
  box-shadow:0 14px 30px rgba(3,39,59,.11),inset 0 1px 0 rgba(255,255,255,.42)!important;
}
#perfilPanel .pdf-box::before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;
  width:4px;
  background:linear-gradient(180deg,var(--primario),var(--primario2));
  pointer-events:none;
}
#perfilPanel .pdf-box:first-of-type::after{
  content:"⚓";
  position:absolute;
  right:-18px;
  top:-14px;
  font-size:98px;
  color:var(--primario);
  opacity:.045;
  transform:rotate(-12deg);
  pointer-events:none;
}
#perfilAvatar{
  overflow:hidden;
  background:linear-gradient(145deg,var(--primario),var(--primario2))!important;
  border-color:color-mix(in srgb,var(--primario) 70%,white)!important;
  box-shadow:0 10px 24px color-mix(in srgb,var(--primario) 28%,transparent),0 0 0 5px color-mix(in srgb,var(--primario) 9%,transparent)!important;
}
#rachaEstudio{
  background:
    radial-gradient(circle at 82% 20%,rgba(255,255,255,.18),transparent 30%),
    linear-gradient(135deg,#f57c00,#ffb300)!important;
  border:1px solid rgba(255,255,255,.25)!important;
  box-shadow:0 10px 26px rgba(245,124,0,.26),inset 0 1px 0 rgba(255,255,255,.24)!important;
}
#perfilNombre{color:var(--primario2)!important;letter-spacing:.2px}
#perfilEmail{color:var(--text)!important}
#perfilPanel .pdf-box:first-of-type>div:last-child{
  background:linear-gradient(145deg,color-mix(in srgb,var(--primarioLight) 72%,var(--grisClaro)),var(--grisClaro))!important;
  border:1px solid color-mix(in srgb,var(--primario) 14%,var(--borde));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35);
}
#perfilPanel .pdf-box:first-of-type>div:last-child>div{
  border-bottom:1px dashed color-mix(in srgb,var(--primario) 15%,var(--borde));
  padding-bottom:4px;
  margin-bottom:4px;
}
#perfilPanel .pdf-box:first-of-type>div:last-child>div:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
#recordatorioEstudioPerfil::after{content:"🔔";position:absolute;right:12px;bottom:-18px;font-size:72px;opacity:.035;pointer-events:none}
#estadisticasUsoPerfil::after{content:"📊";position:absolute;right:10px;bottom:-15px;font-size:76px;opacity:.035;pointer-events:none}
#rankingNacionalPerfil::after{content:"🏅";position:absolute;right:9px;bottom:-15px;font-size:76px;opacity:.04;pointer-events:none}
#recordatorioEstudioPerfil>div:first-child,
#estadisticasUsoPerfil>div:first-child,
#rankingNacionalPerfil>div:first-child{
  position:relative;
  z-index:1;
}
#recordatorioEstudioPerfil input,
#rankingNacionalPerfil input{
  background:linear-gradient(145deg,var(--card),color-mix(in srgb,var(--grisClaro) 64%,var(--card)))!important;
  border-color:color-mix(in srgb,var(--primario) 19%,var(--borde))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35)!important;
}
#btnRecordatorioEstudio,
#rankingNacionalPerfil button,
#perfilPanel .btn{
  box-shadow:0 8px 18px color-mix(in srgb,var(--primario) 19%,transparent)!important;
}
#recordatorioEstadoTexto{
  background:linear-gradient(145deg,var(--grisClaro),color-mix(in srgb,var(--primarioLight) 30%,var(--grisClaro)))!important;
  border:1px solid color-mix(in srgb,var(--primario) 12%,var(--borde));
}
#estadisticasUsoPerfil>div:nth-child(2)>div{
  background:linear-gradient(145deg,var(--grisClaro),color-mix(in srgb,var(--primarioLight) 28%,var(--grisClaro)))!important;
  border:1px solid color-mix(in srgb,var(--primario) 12%,var(--borde));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35);
}
#estadisticasUsoPerfil>div:nth-child(3){
  background:linear-gradient(145deg,var(--grisClaro),color-mix(in srgb,var(--primarioLight) 28%,var(--grisClaro)))!important;
  border:1px solid color-mix(in srgb,var(--primario) 12%,var(--borde));
}
#rankingNacionalPerfil>div:nth-child(2){
  background:
    radial-gradient(circle at 85% 15%,rgba(255,255,255,.18),transparent 30%),
    linear-gradient(135deg,var(--primario),var(--primario2))!important;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 10px 23px color-mix(in srgb,var(--primario) 24%,transparent);
}
#listaRankingNacional>div{
  background:linear-gradient(145deg,var(--card),color-mix(in srgb,var(--primarioLight) 22%,var(--card)))!important;
  border:1px solid color-mix(in srgb,var(--primario) 12%,var(--borde))!important;
}
#perfilPanel .pdf-box:last-of-type>div{
  background:linear-gradient(145deg,var(--grisClaro),color-mix(in srgb,var(--primarioLight) 28%,var(--grisClaro)))!important;
  border:1px solid color-mix(in srgb,var(--primario) 12%,var(--borde));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35);
}
#btnToggleAuto{
  box-shadow:0 6px 14px color-mix(in srgb,var(--primario) 14%,transparent);
}
#velocidadVozPerfil{accent-color:var(--primario)}
body.dark #perfilPanel .pdf-box{
  box-shadow:0 16px 34px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.05)!important;
}



/* ===== BUSCADOR GLOBAL + CONTINUAR TEST 6.5 ===== */
/* Rediseño visual sin alterar tamaño, proporción ni ubicación */
#buscadorGlobal{
  width:100% !important;
  padding:14px 16px !important;
  border-radius:12px !important;
  box-sizing:border-box !important;
  font-size:14px !important;
  color:var(--text) !important;
  border:1.5px solid color-mix(in srgb,var(--primario) 30%,var(--borde)) !important;
  background:
    linear-gradient(145deg,var(--vidrio-fuerte),var(--vidrio)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.48),
    0 8px 20px rgba(3,39,59,.10),
    0 0 0 1px color-mix(in srgb,var(--primario) 5%,transparent) !important;
  backdrop-filter:blur(16px) saturate(145%);
  -webkit-backdrop-filter:blur(16px) saturate(145%);
  outline:none !important;
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease !important;
}
#buscadorGlobal::placeholder{
  color:color-mix(in srgb,var(--text) 55%,transparent);
  opacity:1;
}
#buscadorGlobal:focus{
  border-color:var(--primario) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    0 0 0 4px color-mix(in srgb,var(--primario) 13%,transparent),
    0 11px 24px rgba(3,39,59,.13) !important;
}
#resultadosBusqueda{
  border-color:color-mix(in srgb,var(--primario) 24%,var(--borde)) !important;
  background:linear-gradient(145deg,var(--vidrio-fuerte),var(--vidrio)) !important;
  backdrop-filter:blur(20px) saturate(150%);
  -webkit-backdrop-filter:blur(20px) saturate(150%);
  box-shadow:0 18px 38px rgba(3,39,59,.18) !important;
}
#continuarBanner{
  display:none;
  margin:10px !important;
  padding:12px 14px !important;
  border-radius:12px !important;
  color:white !important;
  cursor:pointer;
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.22) !important;
  background:
    radial-gradient(circle at 88% 20%,rgba(255,255,255,.18),transparent 24%),
    linear-gradient(100deg,#e86f00,#ff8c00 52%,#ffae24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.27),
    0 11px 25px rgba(232,111,0,.25) !important;
  transition:filter .18s ease,box-shadow .18s ease !important;
}
#continuarBanner::before{
  content:"▶";
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%);
  width:32px;
  height:32px;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.22);
  font-size:13px;
  pointer-events:none;
}
#continuarBanner::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(112deg,transparent 0 38%,rgba(255,255,255,.16) 49%,transparent 60%);
  transform:translateX(-120%);
  transition:transform .55s ease;
  pointer-events:none;
}
#continuarBanner:hover::after{transform:translateX(120%)}
#continuarBanner:hover{
  filter:brightness(1.035);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.3),
    0 13px 29px rgba(232,111,0,.30) !important;
}
#continuarBanner b{
  display:inline-block;
  padding-right:44px;
  font-size:13px;
  letter-spacing:.55px;
  font-weight:950;
  position:relative;
  z-index:1;
}
#continuarBanner #continuarSub{
  display:block;
  padding-right:44px;
  margin-top:3px;
  font-size:11px;
  opacity:.9;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  position:relative;
  z-index:1;
}
body.dark #buscadorGlobal{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 9px 22px rgba(0,0,0,.25) !important;
}


/* ===== BARRA SUPERIOR 6.6.3 — REDISEÑO ESTABLE =====
   Solo acabado visual. Sin filtros, pseudo-elementos ni cambios de capas. */
.top{
  background:linear-gradient(135deg,color-mix(in srgb,var(--card) 94%,white),color-mix(in srgb,var(--primarioLight) 24%,var(--card))) !important;
  border-color:color-mix(in srgb,var(--primario) 30%,var(--borde)) !important;
  border-bottom-color:color-mix(in srgb,var(--primario) 58%,var(--borde)) !important;
  box-shadow:0 10px 24px rgba(3,39,59,.13),inset 0 1px 0 rgba(255,255,255,.58) !important;
}
.top>span:first-child{
  color:var(--primario2);
  font-weight:950;
  letter-spacing:.65px;
  text-shadow:0 1px 0 rgba(255,255,255,.38);
}
.top>span:last-child{
  display:flex;
  align-items:center;
  gap:6px;
}
.top .switch{
  background:linear-gradient(145deg,var(--card),color-mix(in srgb,var(--primarioLight) 30%,var(--card))) !important;
  border-color:color-mix(in srgb,var(--primario) 30%,var(--borde)) !important;
  color:var(--text) !important;
  box-shadow:0 5px 12px rgba(3,39,59,.10),inset 0 1px 0 rgba(255,255,255,.52) !important;
}
.top .switch:hover{
  border-color:var(--primario) !important;
  background:color-mix(in srgb,var(--primarioLight) 58%,var(--card)) !important;
}
body.dark .top{
  background:linear-gradient(135deg,#203238,#18282e) !important;
  border-color:#345158 !important;
  border-bottom-color:var(--primario) !important;
  box-shadow:0 10px 24px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.06) !important;
}
body.dark .top>span:first-child{
  color:color-mix(in srgb,var(--primario) 76%,white);
  text-shadow:0 1px 8px color-mix(in srgb,var(--primario) 22%,transparent);
}
body.dark .top .switch{
  background:#263b41 !important;
  border-color:#3b5b62 !important;
  color:var(--text) !important;
  box-shadow:0 5px 12px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.05) !important;
}
body.dark .top .switch:hover{
  background:#2d474e !important;
  border-color:var(--primario) !important;
}


/* ===== CORRECCIÓN 6.6.5 — CAPAS Y PESTAÑAS =====
   La barra solo pertenece al menú; las pantallas internas la cubren. */
.top{
  z-index:120 !important;
}
#pdfPanel,#marinerosPanel,#doctrinaPanel,#legislacionPanel,#culturaPanel,#perfilPanel,#simulacroPanel,#tomosPanel,#quiz{
  top:0 !important;
  height:100% !important;
  z-index:130 !important;
}
body.dark .top{
  z-index:120 !important;
}
body.dark #pdfPanel,body.dark #marinerosPanel,body.dark #doctrinaPanel,body.dark #legislacionPanel,
body.dark #culturaPanel,body.dark #perfilPanel,body.dark #simulacroPanel,body.dark #tomosPanel,body.dark #quiz{
  top:0 !important;
  height:100% !important;
  z-index:130 !important;
}
@media(max-width:640px){
  :root{--alto-barra-app:64px;}
}

/* ===== COBRO PREMIUM 7.0 ===== */
#pay{
  inset:0;
  width:auto;
  height:auto;
  padding:18px;
  box-sizing:border-box;
  background:
    radial-gradient(circle at 50% 0,color-mix(in srgb,var(--primario) 25%,transparent),transparent 34%),
    rgba(1,18,28,.82);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  overflow:auto;
  z-index:500;
}
#pay .cobro-card{
  position:relative;
  width:min(100%,430px);
  max-width:430px;
  padding:0;
  border:1px solid color-mix(in srgb,var(--primario) 30%,var(--borde));
  border-top:0;
  border-radius:26px;
  overflow:hidden;
  text-align:left;
  background:linear-gradient(155deg,var(--vidrio-fuerte),var(--card));
  box-shadow:0 30px 80px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.04) inset;
  animation:cobroEntrada .32s cubic-bezier(.16,1,.3,1);
}
@keyframes cobroEntrada{
  from{opacity:0;transform:translateY(20px) scale(.98)}
  to{opacity:1;transform:none}
}
.cobro-cabecera{
  position:relative;
  overflow:hidden;
  padding:25px 24px 22px;
  color:white;
  background:linear-gradient(135deg,#062f4a 0%,var(--primario2) 62%,var(--primario) 100%);
}
.cobro-cabecera::after{
  content:"⚓";
  position:absolute;
  right:-18px;
  bottom:-38px;
  font-size:135px;
  opacity:.10;
  transform:rotate(-12deg);
}
.cobro-cerrar{
  position:absolute;
  z-index:2;
  top:14px;
  right:14px;
  width:34px;
  height:34px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:50%;
  color:white;
  background:rgba(255,255,255,.12);
  font-size:19px;
  cursor:pointer;
}
.cobro-etiqueta{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 9px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:20px;
  background:rgba(255,255,255,.13);
  font-size:9px;
  font-weight:950;
  letter-spacing:1px;
}
.cobro-cabecera h3{margin:13px 0 2px;font-size:24px;letter-spacing:-.4px}
.cobro-cabecera p{margin:0;font-size:12px;opacity:.82}
.cobro-precio{display:flex;align-items:flex-end;gap:5px;margin-top:14px}
.cobro-precio strong{font-size:42px;line-height:.95;letter-spacing:-2px}
.cobro-precio span{font-size:12px;font-weight:800;opacity:.78;padding-bottom:4px}
.cobro-contenido{padding:20px 22px 22px}
.cobro-beneficios{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:18px}
.cobro-beneficio{
  display:flex;
  gap:8px;
  align-items:center;
  min-height:45px;
  padding:9px 10px;
  box-sizing:border-box;
  border:1px solid var(--borde);
  border-radius:13px;
  background:color-mix(in srgb,var(--primarioLight) 28%,var(--card));
  font-size:10px;
  font-weight:800;
  color:var(--text);
}
.cobro-beneficio span{font-size:17px}
.cobro-pagar{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:9px;
  width:100%;
  margin:0;
  padding:15px;
  border:0;
  border-radius:14px;
  color:white;
  background:linear-gradient(135deg,#635bff,#5147e5);
  box-shadow:0 12px 24px rgba(99,91,255,.28);
  font-size:13px;
  font-weight:950;
  letter-spacing:.3px;
  cursor:pointer;
}
.cobro-seguro{display:flex;justify-content:center;gap:6px;margin:9px 0 16px;color:var(--text);font-size:9px;opacity:.58}
.cobro-divisor{display:flex;align-items:center;gap:9px;margin:4px 0 12px}
.cobro-divisor span{height:1px;flex:1;background:var(--borde)}
.cobro-divisor small{font-size:9px;font-weight:900;letter-spacing:.7px;opacity:.55}
.cobro-codigo{display:flex;gap:8px}
#pay #cod{
  width:auto;
  flex:1;
  min-width:0;
  padding:12px;
  border:1.5px solid var(--borde);
  border-radius:12px;
  outline:none;
  color:var(--text);
  background:var(--bg);
  text-align:center;
  text-transform:uppercase;
  font-weight:850;
  letter-spacing:1px;
}
#pay #cod:focus{border-color:var(--primario);box-shadow:0 0 0 3px color-mix(in srgb,var(--primario) 14%,transparent)}
.cobro-activar{
  flex:0 0 auto;
  width:auto;
  margin:0;
  padding:0 16px;
  border-radius:12px;
  font-size:11px;
}
#stripePagoEstado{
  padding:10px;
  border-radius:10px;
  background:var(--grisClaro);
  text-align:center;
  line-height:1.4;
}
.cobro-terminos{display:block;margin-top:13px;text-align:center;font-size:9px;opacity:.48}
body.dark #pay .cobro-card{background:linear-gradient(155deg,#20343b,#16282e)}
body.dark .cobro-beneficio{background:color-mix(in srgb,var(--primario) 8%,var(--card))}
.pwa-install-btn{
  display:none;border:0;border-radius:999px;padding:7px 11px;margin:0;
  background:linear-gradient(135deg,var(--primario),var(--primario2));
  color:#fff;font:800 11px/1 system-ui,sans-serif;cursor:pointer;
  box-shadow:0 7px 16px color-mix(in srgb,var(--primario) 30%,transparent);
  white-space:nowrap;
}
.pwa-install-btn.visible{display:inline-flex;align-items:center;gap:5px}
#estadoConexionPWA{
  position:fixed;left:50%;top:max(12px,env(safe-area-inset-top));
  transform:translateX(-50%);z-index:12000;display:none;
  width:min(92%,430px);padding:10px 14px;border-radius:14px;
  background:#173b49;color:#fff;text-align:center;
  font:800 12px/1.35 system-ui,sans-serif;box-shadow:0 12px 28px #001c2870;
}
#estadoConexionPWA.visible{display:block}
#estadoConexionPWA.en-linea{background:#087f5b}
@media(display-mode:standalone){
  .pwa-install-btn{display:none!important}
  body{padding-top:env(safe-area-inset-top)}
}
@media(max-width:480px){
  #pay{padding:0;align-items:flex-end}
  #pay .cobro-card{width:100%;max-width:none;border-radius:26px 26px 0 0}
  .cobro-cabecera{padding:22px 20px 19px}
  .cobro-contenido{padding:17px 17px 22px}
  .pwa-install-btn{padding:7px 9px;font-size:10px}
}

#refContent{
  white-space:pre-wrap;
  max-height:430px;
  overflow:auto;
  line-height:1.65;
}
#refContent .ref-coincidencia{
  background:rgba(255,220,72,.28);
  text-decoration:underline;
  text-decoration-thickness:2px;
  text-decoration-color:#e5b800;
  text-underline-offset:3px;
  border-radius:4px;
}
#quiz #boxRef.ref-estructura-visible{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
}
#quiz #refContent.ref-estructura-visible{
  visibility:visible!important;
  opacity:1!important;
  min-height:120px;
  max-height:430px;
  overflow:auto;
}

/* ===== PRODUCCIÓN MÓVIL 8.0 ===== */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;background:#f5f7f8;color-scheme:light;overscroll-behavior-y:none}
html.dark{--bg:#121a1e;--card:#1e2e33;--text:#e0f2f1;--borde:#2f4443;--grisClaro:#263a3d;background:#121a1e;color-scheme:dark}
html.auth-visible,html.auth-visible body{background-color:#00141e!important}
html.auth-visible body{position:fixed!important;inset:0!important;width:100%!important;height:100%!important;overflow:hidden!important;overscroll-behavior:none!important}
html.auth-visible body>:not(#auth):not(#recuperar):not(#appAlert):not(#appConfirm):not(#cargadorTemas):not(#modalSalirApp):not(#modalRefrescarApp):not(script){visibility:hidden!important;pointer-events:none!important}
html.auth-visible #auth,html.auth-visible #recuperar,html.auth-visible #appAlert,html.auth-visible #appConfirm,html.auth-visible #cargadorTemas,html.auth-visible #modalSalirApp,html.auth-visible #modalRefrescarApp{visibility:visible!important}
html.auth-visible #auth{overscroll-behavior:none!important}
body{min-width:0;min-height:100vh;min-height:100dvh;overflow-x:hidden;padding-bottom:env(safe-area-inset-bottom);overscroll-behavior:none}
button,[onclick],.mod,.banner,.opt2,.fuego-materia,.fuego-opcion{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button{min-height:44px}
input,select,textarea{max-width:100%;box-sizing:border-box}
#quiz,#pdfPanel,#marinerosPanel,#doctrinaPanel,#legislacionPanel,#culturaPanel,#perfilPanel,#simulacroPanel,#tomosPanel,#retosPanel{height:100vh;height:100dvh;padding-bottom:max(18px,env(safe-area-inset-bottom))}
.top{padding-top:max(12px,env(safe-area-inset-top));min-height:54px;box-sizing:border-box}
.pwa-install-login{display:none;width:100%;margin:10px 0 2px;padding:12px 14px;border:0;border-radius:13px;background:linear-gradient(135deg,#007f73,#00a896);color:#fff;font-weight:900;cursor:pointer}.pwa-install-login.visible{display:block}
#cabeceraPrincipalMovil{display:contents}
.top-brand{display:inline-flex;align-items:center;gap:7px}
.top-brand img{display:block;width:28px;height:28px;object-fit:cover;border-radius:8px;box-shadow:0 3px 9px rgba(0,0,0,.18)}
@media(max-width:600px){
  body{font-size:15px}
  input,select,textarea{font-size:16px!important}
  #auth{inset:-2px 0 -2px!important;width:auto!important;height:auto!important;min-height:calc(100dvh + 4px);align-items:flex-start;overflow-y:auto;padding:calc(16px + env(safe-area-inset-top)) 12px calc(16px + env(safe-area-inset-bottom));background-color:#00141e!important}
  #auth>.auth-box{margin:auto;max-width:390px;padding:19px 16px;border-radius:22px}
  #auth .auth-box input{width:100%;min-height:48px;margin:5px 0}
  #auth .tabs button,#auth .btn{min-height:46px}
  #cabeceraPrincipalMovil{display:block;position:sticky;top:0;z-index:45;background:var(--bg);isolation:isolate}
  #cabeceraPrincipalMovil>.top{position:relative!important;top:0!important}
  #buscadorGlobalContenedor{position:relative!important;top:0!important;z-index:2!important;background:var(--bg)}
  .top{gap:8px;padding-left:11px;padding-right:9px}
  .top>span:first-child{font-size:12px;white-space:nowrap}
  .top-brand img{width:25px;height:25px;border-radius:7px}
  .top .switch{min-width:39px;min-height:39px;padding:8px;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box}
  .pwa-install-btn{min-height:38px;padding:8px 10px;font-size:10px}
  #buscadorGlobal{min-height:48px;padding:13px 14px!important;font-size:16px!important}
  .barra-rapida{margin:12px 10px!important;padding:12px!important;gap:10px!important;flex-wrap:wrap}
  .barra-rapida>div:first-child{flex:1;min-width:160px}
  #barraEmail{display:inline-block;max-width:165px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}
  #rachaMenu{padding:7px 8px!important}
  #rachaMenu small{display:none}
  .barra-rapida button{min-height:38px;padding:8px 10px!important;font-size:10px}
  .banner,.mod{margin-left:10px;margin-right:10px}
  .accion-ruta{min-height:72px}
  .acciones-duo{gap:8px!important;margin-left:10px!important;margin-right:10px!important}
  .acciones-duo .mod{margin:0!important}
  .quiz-card{padding:14px;border-radius:15px}
  #quiz>div{padding:calc(10px + env(safe-area-inset-top)) 10px calc(24px + env(safe-area-inset-bottom))!important}
  #qt{font-size:17px!important;line-height:1.42!important}
  .opt2{min-height:50px;padding:13px 14px;font-size:15px}
  #refContent{max-height:45vh;max-height:45dvh;font-size:14px!important}
  #resultado{padding:max(10px,env(safe-area-inset-top)) 10px max(10px,env(safe-area-inset-bottom))}
  #pay,#recuperar,#mejorarPanel{height:100vh;height:100dvh}
  #recuperar{align-items:flex-end!important}
  #recuperar>div{width:100%!important;max-width:none!important;max-height:92dvh;overflow-y:auto;border-radius:24px 24px 0 0!important;padding-bottom:max(22px,env(safe-area-inset-bottom))!important}
  #appAlert>div,#appConfirm>div,#modalAreaProf>div{padding-bottom:max(25px,env(safe-area-inset-bottom))!important}
}
@media(max-width:380px){
  .acciones-duo{grid-template-columns:1fr!important}
  .top>span:first-child b{font-size:11px}
  .pwa-install-btn{font-size:0;padding:8px;width:39px}
  .pwa-install-btn::before{content:"⬇";font-size:16px}
}
@media(orientation:landscape) and (max-height:500px){
  #auth{align-items:flex-start}
  #auth>.auth-box{margin:8px auto}
  .resultado-card{max-height:calc(100dvh - 12px)!important}
}

/* Indicador ligero para descargas de bancos Premium. */
#cargadorTemas{position:fixed;inset:0;z-index:12000;display:none;align-items:center;justify-content:center;padding:20px;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
#cargadorTemas.visible{display:flex}
.carga-tema-card{width:min(82vw,290px);padding:24px 20px;border-radius:22px;background:var(--card);border:1px solid var(--borde);text-align:center;color:var(--text);box-shadow:0 18px 55px rgba(0,0,0,.2)}
.carga-spinner{width:42px;height:42px;margin:0 auto 14px;border:4px solid var(--grisClaro);border-top-color:var(--primario);border-radius:50%;animation:girarCarga .75s linear infinite!important}
.carga-tema-card b{display:block;font-size:16px;color:var(--primario2)}
.carga-tema-card small{display:block;margin-top:6px;opacity:.7;line-height:1.4}
@keyframes girarCarga{to{transform:rotate(360deg)}}

/* Confirmación honesta para el botón/gesto Atrás del sistema. */
#modalSalirApp{position:fixed;inset:0;z-index:30000;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(0,20,30,.76);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
#modalSalirApp.visible{display:flex}
#modalRefrescarApp{position:fixed;inset:0;z-index:30000;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(0,20,30,.76);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
#modalRefrescarApp.visible{display:flex}
.salir-app-card{width:min(100%,390px);padding:26px 22px max(22px,env(safe-area-inset-bottom));border:1px solid var(--borde);border-radius:24px;background:var(--card);color:var(--text);text-align:center;box-shadow:0 24px 70px rgba(0,0,0,.38)}
.salir-app-icono{width:62px;height:62px;margin:0 auto 14px;border-radius:20px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--primario),#00a896);color:#fff;font-size:29px;box-shadow:0 10px 25px rgba(0,127,115,.25)}
.salir-app-icono img{display:block;width:100%;height:100%;object-fit:cover;border-radius:20px}
.salir-app-card h3{margin:0 0 9px;color:var(--primario2);font-size:22px}
.salir-app-card p{margin:0 auto 21px;max-width:320px;line-height:1.48;opacity:.8}
.salir-app-acciones{display:grid;grid-template-columns:1fr;gap:10px}
.salir-app-acciones button{width:100%;min-height:50px;border-radius:14px;font-weight:900;letter-spacing:.2px;cursor:pointer}
.salir-app-quedarme{border:0;background:linear-gradient(135deg,var(--primario),#00a896);color:#fff}
.salir-app-salir{border:1px solid var(--borde);background:var(--grisClaro);color:var(--text)}

/* ===== INTERFAZ LIGERA 9.0 ===== */
.personaliza-menu{display:block!important}
@media(max-width:600px){
  html,body{scroll-behavior:auto}
  body,body.dark,#quiz,#pdfPanel,#marinerosPanel,#doctrinaPanel,#legislacionPanel,#culturaPanel,#perfilPanel,#simulacroPanel,#tomosPanel,#retosPanel{background-image:none!important}
  #quiz{background:var(--bg)!important;background-color:var(--bg)!important;z-index:2000!important;isolation:isolate;opacity:1!important}
  #pdfPanel,#marinerosPanel,#doctrinaPanel,#legislacionPanel,#culturaPanel,#perfilPanel,#simulacroPanel,#tomosPanel,#retosPanel{background-color:var(--bg)!important}
  body::before,body::after,#auth::before,.accion-ruta::before,.accion-ruta::after,.simulacro-hero::after,.retos-hero::after{display:none!important}
  *,*::before,*::after{animation:none!important;transition-duration:.12s!important}
  .banner,.mod,.barra-rapida,.pdf-box,.quiz-card,.tomo-card,.accion-ruta,.tema-ruta,.fuego-card,.simulacro-opcion{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:none!important}
  #resultado,#mejorarPanel,#appAlert,#appConfirm,#modalAreaProf{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .top{box-shadow:none!important;background:var(--card)!important}
  #buscadorGlobal{box-shadow:none!important}
  #auth>.auth-box{box-shadow:0 8px 26px rgba(0,0,0,.22)!important}
  #auth .logoFlotante{animation:none!important}
  .barra-rapida{border-left-width:1px!important}
  #barraEmail{display:none!important}
  .accion-ruta{background:var(--card)!important;border:1px solid var(--borde)!important}
  .accion-ruta-icono{box-shadow:none!important}
  .accion-ruta-chip{background:var(--grisClaro)!important;color:var(--text)!important;border:0!important}
  .mod.tema-ruta{content-visibility:visible}
  .fuego-materia:hover,.infiltrado-expediente:hover,.simulacro-opcion:hover{transform:none!important}
}

/* V46.7: cargador visible antes de cualquier cuestionario */
#cargadorTemas.visible{display:flex!important;visibility:visible!important;opacity:1!important;z-index:2147483000!important}

/* V46.8: respuesta tactil inmediata mientras Apps Script valida. */
.opt2.validando{position:relative;transform:scale(.995);opacity:.88}
.opt2.validando::after{content:'Comprobando';margin-left:auto;font-size:.72rem;font-weight:800;letter-spacing:.02em;opacity:.72}


/* V46.9: respuesta táctil inmediata con validación segura en segundo plano */
.opt2{position:relative}
.opt2.bloqueada-validacion{pointer-events:none}
.opt2.bloqueada-validacion:not(.validando){opacity:.58}
.opt2.validando{opacity:1!important;transform:scale(.995);padding-right:128px;transition:transform .12s ease,opacity .12s ease,border-color .12s ease,background .12s ease}
.opt2.validando::after{content:'Comprobando';position:absolute;right:38px;top:50%;transform:translateY(-50%);font-size:.72rem;font-weight:800;letter-spacing:.02em;opacity:.76;white-space:nowrap}
.opt2.validando::before{content:'';position:absolute;right:15px;top:50%;width:13px;height:13px;margin-top:-7px;border:2px solid color-mix(in srgb,var(--primario) 26%,transparent);border-top-color:var(--primario);border-radius:50%;animation:optValidandoGiro .65s linear infinite}
@keyframes optValidandoGiro{to{transform:rotate(360deg)}}
@media(max-width:430px){.opt2.validando{padding-right:102px}.opt2.validando::after{right:34px;font-size:.65rem}}
@media(prefers-reduced-motion:reduce){.opt2.validando::before{animation-duration:1.4s}}

/* V46.15: explicación del bloqueo de Simulacro Completo */
.modal-simulacro-bloqueo{display:none;position:fixed;inset:0;z-index:10050;background:rgba(0,18,28,.72);backdrop-filter:blur(5px);align-items:center;justify-content:center;padding:18px}
.modal-simulacro-card{width:min(430px,100%);background:var(--card);color:var(--text);border:1px solid var(--borde);border-radius:22px;padding:24px;text-align:center;box-shadow:0 24px 70px rgba(0,0,0,.35)}
.modal-simulacro-card h3{margin:8px 0 12px;color:var(--primario2);font-size:21px}
.modal-simulacro-card p{margin:9px 0;line-height:1.5;font-size:14px}
.modal-simulacro-icono{width:58px;height:58px;margin:0 auto 8px;border-radius:18px;display:grid;place-items:center;background:var(--primarioLight);font-size:30px}
.modal-simulacro-cerrar{margin-top:10px;background:none;border:0;color:var(--text);opacity:.7;text-decoration:underline;cursor:pointer;font-weight:700}

.modal-simulacro-bloqueo.activo{display:flex !important;visibility:visible !important;opacity:1 !important;pointer-events:auto !important}
#mensajeBloqueoSimulacro{max-width:360px;margin:0 auto 16px;line-height:1.5;text-align:center;text-wrap:balance}
#btnIrEspecificosSimulacro{align-items:center;justify-content:center}

/* V46.17: listas separadas de preguntas guardadas */
.guardadas-grupo{margin:12px;border:1px solid var(--borde);border-radius:17px;background:color-mix(in srgb,var(--card) 92%,transparent);overflow:hidden}.guardadas-grupo+.guardadas-grupo{margin-top:14px}.guardadas-grupo-cabecera{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 12px 4px}.guardadas-grupo-cabecera b,.guardadas-grupo-cabecera small{display:block}.guardadas-grupo-cabecera b{font-size:12px}.guardadas-grupo-cabecera small{font-size:8px;opacity:.64;margin-top:3px}.guardadas-grupo .guardadas-lista{max-height:260px;padding-top:8px}.guardadas-grupo-oficiales{border-color:color-mix(in srgb,#0b5fa5 30%,var(--borde))}.guardadas-grupo-especificos{border-color:color-mix(in srgb,#7e57c2 30%,var(--borde))}

/* V46.18: acciones separadas siempre visibles */
.guardadas-acciones-principales{position:sticky;top:0;z-index:4;background:color-mix(in srgb,var(--card) 96%,transparent);padding:10px 12px;border-bottom:1px solid var(--borde);grid-template-columns:minmax(0,1fr) auto}
.guardadas-acciones-principales .guardadas-practicar{display:flex;align-items:center;justify-content:flex-start;gap:9px;min-height:52px;padding:10px 13px;text-align:left;font-size:10px;box-shadow:0 8px 18px rgba(86,52,140,.22)}
.guardadas-acciones-principales .guardadas-practicar>span:first-child{font-size:17px}
.guardadas-acciones-principales .guardadas-practicar b,.guardadas-acciones-principales .guardadas-practicar small{display:block}
.guardadas-acciones-principales .guardadas-practicar small{margin-top:3px;font-size:8px;opacity:.82;font-weight:700}
.guardadas-acciones-principales .guardadas-borrar{min-height:52px}
@media(max-width:430px){.guardadas-acciones-principales{grid-template-columns:1fr}.guardadas-acciones-principales .guardadas-borrar{min-height:38px}}

/* V46.19 - Guardadas compactas y accesibles */
.guardadas-hero{padding:12px 14px}.guardadas-hero h3{font-size:15px}.guardadas-hero p{font-size:9px}.guardadas-grupo{margin:9px 10px;border-radius:14px}.guardadas-grupo+.guardadas-grupo{margin-top:9px}.guardadas-resumen{display:grid;grid-template-columns:minmax(105px,1fr) auto auto 36px;align-items:center;gap:8px;padding:9px 10px;background:color-mix(in srgb,var(--card) 96%,transparent);border-bottom:1px solid var(--borde)}.guardadas-identidad{display:flex;align-items:center;gap:8px;min-width:0}.guardadas-icono{width:30px;height:30px;display:grid;place-items:center;flex:0 0 30px;border-radius:10px;background:color-mix(in srgb,#7e57c2 12%,var(--bg));font-size:15px}.guardadas-identidad b,.guardadas-identidad small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.guardadas-identidad b{font-size:11px}.guardadas-identidad small{font-size:8px;opacity:.65;margin-top:1px}.guardadas-resumen .guardadas-contador{min-width:44px;padding:5px 6px;border-radius:10px;background:color-mix(in srgb,#7e57c2 10%,var(--bg));border:1px solid var(--borde);color:inherit}.guardadas-resumen .guardadas-contador b{font-size:15px}.guardadas-resumen .guardadas-contador small{font-size:7px;letter-spacing:0;text-transform:none}.guardadas-resumen .guardadas-practicar{min-height:34px;padding:8px 11px;border-radius:10px;font-size:9px;white-space:nowrap;box-shadow:none}.guardadas-resumen .guardadas-borrar{width:36px;height:34px;min-height:34px;padding:0;border-radius:10px;font-size:13px}.guardadas-grupo .guardadas-lista{max-height:220px;padding:8px 9px 2px}.guardadas-grupo .guardada-item{padding:9px;border-radius:12px}.guardadas-grupo .guardada-contenido b{font-size:10px}.guardadas-grupo .guardada-respuesta{font-size:8px}
@media(max-width:430px){.guardadas-resumen{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"id count" "study delete";gap:7px}.guardadas-identidad{grid-area:id}.guardadas-resumen .guardadas-contador{grid-area:count}.guardadas-resumen .guardadas-practicar{grid-area:study;width:100%;min-height:36px;font-size:10px}.guardadas-resumen .guardadas-borrar{grid-area:delete;width:42px;height:36px}.guardadas-grupo .guardadas-lista{max-height:190px}}


/* V46.20 - barra compacta de preguntas guardadas */
.guardadas-mini{margin-top:12px;padding:10px;border:1px solid var(--borde);border-radius:16px;background:color-mix(in srgb,var(--card) 96%,transparent);box-shadow:0 8px 22px rgba(10,32,58,.08)}
.guardadas-mini-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}.guardadas-mini-head>div{display:flex;align-items:center;gap:6px}.guardadas-mini-head b{font-size:12px}.guardadas-mini-ver{border:0;background:transparent;color:var(--azul);font-size:9px;font-weight:900;padding:5px 7px;border-radius:8px;cursor:pointer}.guardadas-mini-ver:hover{background:color-mix(in srgb,var(--azul) 8%,transparent)}
.guardadas-mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.guardadas-chip{display:grid;grid-template-columns:30px minmax(0,1fr) 16px;align-items:center;gap:7px;min-height:48px;padding:7px 9px;border:1px solid var(--borde);border-radius:13px;background:var(--bg);color:inherit;text-align:left;cursor:pointer;transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}.guardadas-chip:active{transform:scale(.985)}.guardadas-chip:hover{border-color:color-mix(in srgb,var(--azul) 35%,var(--borde));box-shadow:0 6px 14px rgba(10,32,58,.08)}.guardadas-chip-icon{width:30px;height:30px;display:grid;place-items:center;border-radius:9px;font-size:14px}.guardadas-chip-oficiales .guardadas-chip-icon{background:color-mix(in srgb,#0b5fa5 12%,var(--bg))}.guardadas-chip-especificos .guardadas-chip-icon{background:color-mix(in srgb,#7e57c2 12%,var(--bg))}.guardadas-chip-copy{min-width:0}.guardadas-chip-copy b,.guardadas-chip-copy small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.guardadas-chip-copy b{font-size:10px}.guardadas-chip-copy small{margin-top:1px;font-size:8px;opacity:.66}.guardadas-chip-go{font-size:18px;opacity:.45;text-align:right}
.guardadas-mini-detalle{margin-top:10px;padding-top:9px;border-top:1px solid var(--borde)}.guardadas-mini-detalle[hidden]{display:none!important}.guardadas-mini-lista+.guardadas-mini-lista{margin-top:10px}.guardadas-mini-lista-head{display:flex;align-items:center;justify-content:space-between;padding:0 2px 5px}.guardadas-mini-lista-head b{font-size:9px}.guardadas-mini-lista-head button{border:0;background:#fee2e2;color:#b91c1c;border-radius:8px;padding:5px 7px;font-size:8px;font-weight:900;cursor:pointer}.guardadas-mini .guardadas-lista{max-height:170px;padding:0;gap:6px}.guardadas-mini .guardada-item{padding:8px;border-radius:10px}.guardadas-mini .guardada-numero{width:26px;height:26px;flex-basis:26px}.guardadas-mini .guardada-contenido b{font-size:9px}.guardadas-mini .guardada-respuesta{font-size:8px}.guardadas-mini .guardada-eliminar{width:28px;height:28px;flex-basis:28px}
@media(max-width:370px){.guardadas-mini-grid{grid-template-columns:1fr}.guardadas-chip{min-height:44px}}


/* V46.22 - mapa compacto de progreso del examen */
.progreso-examen{margin-top:16px;padding:14px;border:1px solid var(--borde);border-radius:16px;background:var(--card);box-shadow:0 8px 22px rgba(10,32,58,.06)}
.progreso-examen-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.progreso-examen-head b,.progreso-examen-head small{display:block}.progreso-examen-head b{font-size:15px;color:var(--primario2)}.progreso-examen-head small{margin-top:2px;font-size:10px;opacity:.68}.progreso-marcar{border:1px solid var(--borde);background:var(--grisClaro);color:var(--text);padding:7px 10px;border-radius:10px;font-size:10px;font-weight:900;cursor:pointer}.progreso-marcar.activa{background:#fff7d6;border-color:#f2b705;color:#7a5300}
.progreso-barra{height:7px;margin-top:11px;border-radius:999px;background:var(--grisClaro);overflow:hidden}.progreso-barra span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--primario),var(--azul));border-radius:inherit;transition:width .22s ease}
.progreso-resumen{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:10px}.progreso-resumen>div{padding:8px;border:1px solid var(--borde);border-radius:11px;text-align:center;background:color-mix(in srgb,var(--grisClaro) 72%,transparent)}.progreso-resumen b{display:block;font-size:16px;color:var(--primario2)}.progreso-resumen small{display:block;margin-top:1px;font-size:8px;opacity:.68}
.progreso-acciones{display:flex;justify-content:flex-end;margin-top:9px}.progreso-acciones button{border:0;background:transparent;color:var(--azul);font-size:9px;font-weight:900;cursor:pointer;padding:4px 0}
.progreso-paleta{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:5px;margin-top:10px}.progreso-pregunta{position:relative;min-height:31px;padding:0;border:1px solid var(--borde);border-radius:8px;background:var(--card);color:var(--text);font-size:9px;font-weight:800;cursor:pointer}.progreso-pregunta.respondida{background:#e7f7ec;border-color:#58ad71;color:#21683a}.progreso-pregunta.actual{outline:2px solid var(--primario);outline-offset:1px}.progreso-pregunta.marcada::after{content:'★';position:absolute;right:2px;top:1px;font-size:7px;color:#d99a00}.progreso-pregunta:focus-visible{outline:3px solid color-mix(in srgb,var(--primario) 42%,transparent);outline-offset:1px}
.progreso-leyenda{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px;font-size:8px;opacity:.72}.progreso-leyenda span{display:flex;align-items:center;gap:4px}.progreso-leyenda i{width:9px;height:9px;border-radius:3px;border:1px solid var(--borde);background:var(--card)}.progreso-leyenda i.respondida{background:#e7f7ec;border-color:#58ad71}.progreso-leyenda i.marcada{background:#fff7d6;border-color:#f2b705}
@media(max-width:520px){.progreso-paleta{grid-template-columns:repeat(8,minmax(0,1fr))}.progreso-examen{padding:12px}.progreso-pregunta{min-height:29px}}
@media(max-width:380px){.progreso-paleta{grid-template-columns:repeat(6,minmax(0,1fr))}.progreso-resumen small{font-size:7px}.progreso-examen-head b{font-size:14px}}

/* V46.25 - navegación compacta deslizante */
.progreso-examen-compacto{padding:12px 13px;margin-top:16px;border-radius:18px;background:linear-gradient(145deg,color-mix(in srgb,var(--card) 92%,var(--primarioLight)),var(--card));box-shadow:0 10px 26px rgba(0,0,0,.08)}
.progreso-compacto-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.progreso-compacto-texto{display:flex;flex-direction:column;gap:1px}.progreso-compacto-texto b{font-size:14px}.progreso-compacto-texto small{font-size:10px;opacity:.68;font-weight:700}
.progreso-ventana-wrap{display:grid;grid-template-columns:34px minmax(0,1fr) 34px;align-items:center;gap:7px;margin-top:10px}.progreso-ventana{display:grid;grid-template-columns:repeat(5,minmax(34px,1fr));gap:6px}.progreso-flecha{width:34px;height:34px;border-radius:50%;border:1px solid var(--borde);background:var(--card);color:var(--primario2);font-size:23px;line-height:1;cursor:pointer}.progreso-flecha:disabled{opacity:.28;cursor:default}
.progreso-ventana .progreso-pregunta{min-height:34px;border-radius:50%;font-size:11px;transition:transform .18s ease,background .18s ease}.progreso-ventana .progreso-pregunta.actual{background:var(--primario);color:#fff;border-color:var(--primario);outline:0;transform:scale(1.08);box-shadow:0 5px 14px color-mix(in srgb,var(--primario) 34%,transparent)}.progreso-ventana .progreso-pregunta.respondida:not(.actual){background:color-mix(in srgb,var(--primarioLight) 72%,var(--card));border-color:color-mix(in srgb,var(--primario) 42%,var(--borde));color:var(--primario2)}
.progreso-compacto-meta{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:9px;font-size:9px;opacity:.72}.progreso-compacto-meta b{color:var(--primario2);font-size:11px}.progreso-examen-compacto .progreso-marcar{padding:6px 9px;font-size:10px}.progreso-examen-compacto .progreso-barra{height:4px;margin-top:8px}
@media(max-width:420px){.progreso-ventana-wrap{grid-template-columns:30px minmax(0,1fr) 30px;gap:5px}.progreso-ventana{gap:4px}.progreso-flecha{width:30px;height:30px}.progreso-ventana .progreso-pregunta{min-height:31px;font-size:10px}.progreso-compacto-meta{gap:9px}}

/* V46.26 - navegación premium del cuestionario */
.quiz-nav-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 10px}.quiz-nav-action{min-height:44px;border-radius:14px;border:1px solid var(--borde);display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;font-weight:900;cursor:pointer;transition:transform .15s ease,opacity .15s ease,box-shadow .15s ease}.quiz-nav-action:active:not(:disabled){transform:scale(.985)}.quiz-nav-action:disabled{opacity:.3;cursor:default}.quiz-nav-action span{font-size:21px;line-height:1}.quiz-nav-action-secundaria{background:var(--card);color:var(--text)}.quiz-nav-action-principal{background:linear-gradient(135deg,var(--primario),var(--azul));color:#fff;border-color:transparent;box-shadow:0 8px 18px color-mix(in srgb,var(--primario) 24%,transparent)}
.quiz-progress-dock{position:relative;margin-top:10px;padding:13px;border:1px solid color-mix(in srgb,var(--borde) 76%,transparent);border-radius:22px;background:color-mix(in srgb,var(--card) 91%,transparent);box-shadow:0 14px 36px rgba(7,27,52,.12);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px)}
.quiz-progress-summary{display:flex;align-items:flex-end;justify-content:space-between;gap:10px}.quiz-progress-copy{display:flex;flex-direction:column}.quiz-progress-copy small{font-size:8px;font-weight:950;letter-spacing:.14em;opacity:.5}.quiz-progress-copy strong{font-size:15px;line-height:1.15;color:var(--primario2)}.quiz-progress-copy strong em{font-style:normal;font-size:10px;opacity:.55}.quiz-progress-percent{min-width:48px;text-align:right;font-size:21px;font-weight:950;line-height:1;color:var(--primario2)}
.quiz-progress-track{height:4px;margin-top:9px;border-radius:999px;background:color-mix(in srgb,var(--borde) 55%,transparent);overflow:hidden}.quiz-progress-track span{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,var(--primario),#4fa7ff);transition:width .28s ease}
.quiz-progress-capsule{display:grid;grid-template-columns:34px minmax(0,1fr) 34px;align-items:center;gap:6px;margin-top:12px}.quiz-progress-arrow{width:34px;height:34px;border:0;border-radius:12px;background:color-mix(in srgb,var(--grisClaro) 78%,transparent);color:var(--primario2);font-size:23px;line-height:1;cursor:pointer}.quiz-progress-arrow:disabled{opacity:.24;cursor:default}.quiz-progress-window-trigger{position:relative;min-width:0;padding:5px 28px 5px 6px;border:1px solid color-mix(in srgb,var(--borde) 80%,transparent);border-radius:16px;background:color-mix(in srgb,var(--bg) 76%,transparent)}.quiz-progress-window{display:grid;grid-template-columns:repeat(5,minmax(28px,1fr));align-items:center;gap:4px}.quiz-progress-window .progreso-pregunta{position:relative;min-width:0;min-height:31px;border:0;border-radius:10px;background:transparent;color:color-mix(in srgb,var(--text) 58%,transparent);font-size:10px;font-weight:900;cursor:pointer}.quiz-progress-window .progreso-pregunta.respondida:not(.actual){background:color-mix(in srgb,var(--primarioLight) 72%,transparent);color:var(--primario2)}.quiz-progress-window .progreso-pregunta.actual{background:linear-gradient(135deg,var(--primario),var(--azul));color:#fff;box-shadow:0 6px 14px color-mix(in srgb,var(--primario) 28%,transparent);transform:none;outline:0}.quiz-progress-window .progreso-pregunta.marcada::after{content:'•';position:absolute;bottom:1px;left:50%;transform:translateX(-50%);font-size:15px;line-height:.3;color:#f2b705}.quiz-progress-expand{position:absolute;right:5px;top:50%;transform:translateY(-50%);width:23px;height:23px;border:0;border-radius:8px;background:color-mix(in srgb,var(--primarioLight) 78%,transparent);color:var(--primario2);font-size:13px;font-weight:900;cursor:pointer}
.quiz-progress-footer{display:flex;align-items:center;justify-content:space-between;gap:9px;margin-top:10px}.quiz-progress-stats{display:flex;align-items:center;gap:9px;min-width:0;font-size:8px;opacity:.64}.quiz-progress-stats b{font-size:10px;color:var(--primario2)}.quiz-progress-mark{min-height:31px;padding:6px 10px;border:1px solid var(--borde);border-radius:11px;background:var(--grisClaro);color:var(--text);font-size:9px;font-weight:950;cursor:pointer}.quiz-progress-mark.activa{background:#fff7d6;border-color:#f2b705;color:#7a5300}
.quiz-map-sheet{position:fixed;inset:0;z-index:100020;display:none}.quiz-map-sheet.activo{display:block}.quiz-map-backdrop{position:absolute;inset:0;width:100%;height:100%;border:0;background:rgba(3,13,27,.5);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}.quiz-map-panel{position:absolute;left:0;right:0;bottom:0;max-height:min(72vh,620px);padding:8px 16px calc(18px + env(safe-area-inset-bottom));border-radius:26px 26px 0 0;background:var(--card);box-shadow:0 -20px 60px rgba(0,0,0,.28);overflow:auto;animation:quizMapUp .22s ease-out}.quiz-map-handle{width:42px;height:4px;margin:2px auto 12px;border-radius:999px;background:color-mix(in srgb,var(--text) 18%,transparent)}.quiz-map-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.quiz-map-head small{display:block;font-size:8px;font-weight:950;letter-spacing:.12em;opacity:.48}.quiz-map-head h3{margin:2px 0 0;font-size:18px;color:var(--primario2)}.quiz-map-head>button{width:34px;height:34px;border:0;border-radius:50%;background:var(--grisClaro);color:var(--text);font-size:21px;cursor:pointer}.quiz-map-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:14px}.quiz-map-summary span{padding:8px 5px;border:1px solid var(--borde);border-radius:12px;background:var(--grisClaro);text-align:center;font-size:8px;opacity:.72}.quiz-map-summary b{display:block;font-size:15px;color:var(--primario2);opacity:1}.quiz-map-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;margin-top:14px}.quiz-map-number{position:relative;aspect-ratio:1;border:1px solid var(--borde);border-radius:12px;background:var(--card);color:var(--text);font-size:10px;font-weight:900;cursor:pointer}.quiz-map-number.respondida{background:color-mix(in srgb,var(--primarioLight) 72%,var(--card));border-color:color-mix(in srgb,var(--primario) 38%,var(--borde));color:var(--primario2)}.quiz-map-number.actual{background:linear-gradient(135deg,var(--primario),var(--azul));border-color:transparent;color:#fff;box-shadow:0 5px 12px color-mix(in srgb,var(--primario) 26%,transparent)}.quiz-map-number.marcada::after{content:'★';position:absolute;right:2px;top:1px;font-size:7px;color:#f2b705}.quiz-map-number.actual.marcada::after{color:#ffe788}.quiz-map-open{overflow:hidden}@keyframes quizMapUp{from{transform:translateY(35px);opacity:.5}to{transform:translateY(0);opacity:1}}
@media(max-width:420px){.quiz-nav-actions{gap:8px}.quiz-nav-action{min-height:42px;border-radius:13px}.quiz-progress-dock{padding:12px;border-radius:20px}.quiz-progress-capsule{grid-template-columns:31px minmax(0,1fr) 31px;gap:4px}.quiz-progress-arrow{width:31px;height:31px;border-radius:10px}.quiz-progress-window-trigger{padding-left:4px;padding-right:26px}.quiz-progress-window{gap:2px}.quiz-progress-window .progreso-pregunta{min-height:29px;font-size:9px}.quiz-progress-stats{gap:6px}.quiz-map-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}


/* V46.27 - progreso tipo experiencia naval */
.quiz-xp-panel{overflow:hidden;padding:15px 15px 13px;border:1px solid color-mix(in srgb,var(--primario) 20%,var(--borde));background:linear-gradient(155deg,color-mix(in srgb,var(--card) 94%,transparent),color-mix(in srgb,var(--primarioLight) 36%,var(--card)));box-shadow:0 18px 42px rgba(4,27,57,.16)}
.quiz-xp-panel::before{content:'';position:absolute;inset:0 0 auto;height:54px;background:radial-gradient(circle at 12% 0,color-mix(in srgb,var(--primario) 17%,transparent),transparent 58%);pointer-events:none}
.quiz-xp-head{position:relative;display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:10px}.quiz-xp-badge{display:grid;place-items:center;width:40px;height:40px;border-radius:14px;background:linear-gradient(145deg,var(--primario),var(--azul));box-shadow:0 8px 18px color-mix(in srgb,var(--primario) 28%,transparent);font-size:20px}.quiz-xp-copy{display:flex;min-width:0;flex-direction:column}.quiz-xp-copy small{font-size:8px;font-weight:950;letter-spacing:.16em;opacity:.56}.quiz-xp-copy strong{margin-top:2px;color:var(--primario2);font-size:19px;line-height:1}.quiz-xp-copy strong em{font-style:normal;font-size:10px;opacity:.55}.quiz-xp-rank{padding:7px 9px;border:1px solid color-mix(in srgb,var(--primario) 18%,var(--borde));border-radius:999px;background:color-mix(in srgb,var(--primarioLight) 72%,var(--card));color:var(--primario2);font-size:8px;font-weight:950;letter-spacing:.08em}
.quiz-xp-track{position:relative;height:13px;margin:15px 5px 0;border:1px solid color-mix(in srgb,var(--primario) 15%,var(--borde));border-radius:999px;background:linear-gradient(180deg,color-mix(in srgb,var(--grisClaro) 82%,transparent),color-mix(in srgb,var(--borde) 45%,transparent));box-shadow:inset 0 2px 5px rgba(4,27,57,.12);overflow:visible}.quiz-xp-track>span{position:absolute;inset:0 auto 0 0;width:0;border-radius:999px;background:linear-gradient(90deg,#1e88e5 0%,#1fbf8f 45%,#f2b705 76%,#ff8f00 100%);box-shadow:0 0 16px color-mix(in srgb,#1e88e5 38%,transparent);transition:width .42s cubic-bezier(.2,.75,.2,1)}.quiz-xp-track>span::after{content:'';position:absolute;right:-5px;top:50%;width:11px;height:11px;border:3px solid #fff;border-radius:50%;background:#f2b705;box-shadow:0 2px 9px rgba(0,0,0,.28);transform:translateY(-50%)}.xp-milestone{position:absolute;top:50%;width:8px;height:8px;border:2px solid var(--card);border-radius:50%;background:color-mix(in srgb,var(--text) 18%,var(--grisClaro));box-shadow:0 1px 5px rgba(0,0,0,.14);transform:translate(-50%,-50%);transition:transform .2s ease,background .2s ease}.xp-milestone::after{content:attr(data-label);position:absolute;top:13px;left:50%;font-size:7px;font-style:normal;font-weight:900;opacity:.38;transform:translateX(-50%)}.xp-milestone.m25{left:25%}.xp-milestone.m50{left:50%}.xp-milestone.m75{left:75%}.xp-milestone.m100{left:100%}.xp-milestone.alcanzado{background:#f2b705;transform:translate(-50%,-50%) scale(1.15)}.xp-milestone.siguiente{animation:xpPulse 1.5s ease-in-out infinite}.quiz-xp-caption{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:15px 3px 0;font-size:8px;opacity:.66}.quiz-xp-caption b{white-space:nowrap;color:var(--primario2);font-size:9px;opacity:1}.quiz-xp-panel .quiz-progress-capsule{margin-top:11px}.quiz-xp-panel .quiz-progress-footer{margin-top:9px;padding-top:8px;border-top:1px solid color-mix(in srgb,var(--borde) 70%,transparent)}
@keyframes xpPulse{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,#f2b705 35%,transparent)}50%{box-shadow:0 0 0 6px transparent}}
@media(max-width:420px){.quiz-xp-panel{padding:13px 11px 11px;border-radius:20px}.quiz-xp-head{grid-template-columns:35px minmax(0,1fr) auto;gap:8px}.quiz-xp-badge{width:35px;height:35px;border-radius:12px;font-size:17px}.quiz-xp-copy strong{font-size:17px}.quiz-xp-rank{padding:6px 7px;font-size:7px}.quiz-xp-caption{font-size:7px}.quiz-xp-track{margin-left:4px;margin-right:4px}}

/* V46.28 · Progreso alineado con la identidad visual de Academia Naval */
.quiz-rumbo-panel{overflow:hidden;padding:14px;border:1px solid var(--borde);border-radius:16px;background:var(--card);box-shadow:0 6px 18px rgba(38,50,56,.08);backdrop-filter:none;-webkit-backdrop-filter:none}
.quiz-rumbo-panel::before{display:none!important}
.quiz-rumbo-head{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:10px}
.quiz-rumbo-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:var(--primarioLight);color:var(--primario2);font-size:18px;border:1px solid color-mix(in srgb,var(--primario) 18%,var(--borde))}
.quiz-rumbo-copy{display:flex;min-width:0;flex-direction:column;gap:2px}.quiz-rumbo-copy small{font-size:9px;font-weight:900;letter-spacing:.13em;color:var(--gris)}.quiz-rumbo-copy strong{font-size:17px;line-height:1.1;color:var(--text)}
.quiz-rumbo-status{min-width:43px;padding:6px 8px;border-radius:9px;background:var(--primarioLight);color:var(--primario2);font-size:12px;font-weight:900;text-align:center}
.quiz-rumbo-track{height:8px;margin-top:12px;border-radius:999px;background:var(--grisClaro);overflow:hidden;border:1px solid color-mix(in srgb,var(--borde) 72%,transparent)}
.quiz-rumbo-track>span{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,var(--primario),var(--primario2));box-shadow:none;transition:width .3s ease}
.quiz-rumbo-track>span::after{display:none!important}
.quiz-rumbo-caption{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:7px;color:var(--gris);font-size:9px}.quiz-rumbo-caption b{color:var(--primario2);font-size:9px}
.quiz-rumbo-panel .quiz-progress-capsule{margin-top:12px;padding-top:11px;border-top:1px solid var(--borde)}
.quiz-rumbo-panel .quiz-progress-window-trigger{background:var(--bg);border-color:var(--borde);box-shadow:none}
.quiz-rumbo-panel .quiz-progress-window .progreso-pregunta.actual{background:var(--primario);box-shadow:0 4px 10px color-mix(in srgb,var(--primario) 22%,transparent)}
.quiz-rumbo-panel .quiz-progress-window .progreso-pregunta.respondida:not(.actual){background:var(--primarioLight);color:var(--primario2)}
.quiz-rumbo-panel .quiz-progress-arrow,.quiz-rumbo-panel .quiz-progress-expand{background:var(--grisClaro);color:var(--primario2)}
.quiz-rumbo-panel .quiz-progress-footer{margin-top:9px;padding-top:9px;border-top:1px solid var(--borde)}
body.dark .quiz-rumbo-panel{box-shadow:0 8px 24px rgba(0,0,0,.22)}
body.dark .quiz-rumbo-status,body.dark .quiz-rumbo-icon{background:color-mix(in srgb,var(--primario) 16%,var(--card))}
@media(max-width:420px){.quiz-rumbo-panel{padding:12px;border-radius:14px}.quiz-rumbo-head{grid-template-columns:32px minmax(0,1fr) auto;gap:8px}.quiz-rumbo-icon{width:32px;height:32px;border-radius:9px;font-size:16px}.quiz-rumbo-copy strong{font-size:15px}.quiz-rumbo-status{min-width:39px;padding:5px 7px;font-size:11px}.quiz-rumbo-track{height:7px;margin-top:10px}}
\n\n/* V46.29 · Controles alineados con el color elegido y mapa junto a Marcar */\n.quiz-progress-window-trigger{padding-right:6px}\n.quiz-progress-expand{display:none!important}\n.quiz-progress-footer{align-items:center}\n.quiz-progress-tools{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}\n.quiz-progress-map{min-height:32px;padding:7px 10px;border:1px solid color-mix(in srgb,var(--primario) 32%,var(--borde));border-radius:10px;background:var(--primarioLight);color:var(--primario2);font-size:10px;font-weight:900;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}\n.quiz-progress-map:active{transform:scale(.98)}\n.quiz-nav-action-secundaria{background:var(--primarioLight);color:var(--primario2);border-color:color-mix(in srgb,var(--primario) 35%,var(--borde));box-shadow:0 5px 14px color-mix(in srgb,var(--primario) 12%,transparent)}\n.quiz-nav-action-principal{background:linear-gradient(135deg,var(--primario),var(--primario2));color:#fff;border-color:transparent;box-shadow:0 8px 18px color-mix(in srgb,var(--primario) 26%,transparent)}\n.quiz-nav-action:focus-visible,.quiz-progress-map:focus-visible{outline:3px solid color-mix(in srgb,var(--primario) 36%,transparent);outline-offset:2px}\n@media(max-width:420px){.quiz-progress-tools{gap:5px}.quiz-progress-mark,.quiz-progress-map{padding:6px 8px;font-size:9px}}\n\n\n/* V46.32 · Navegación principal llamativa y adaptada al color elegido */\n.quiz-nav-actions{\n  gap:12px;\n  margin:20px 0 12px;\n}\n.quiz-nav-action{\n  position:relative;\n  min-height:54px;\n  border:0;\n  border-radius:18px;\n  overflow:hidden;\n  isolation:isolate;\n  font-size:13px;\n  letter-spacing:.15px;\n  color:#fff;\n  box-shadow:0 10px 24px color-mix(in srgb,var(--primario) 25%,transparent),inset 0 1px 0 rgba(255,255,255,.22);\n  transition:transform .14s ease,box-shadow .18s ease,filter .18s ease,opacity .18s ease;\n}\n.quiz-nav-action::before{\n  content:\"\";\n  position:absolute;inset:0;z-index:-1;\n  background:linear-gradient(135deg,var(--primario),var(--primario2));\n}\n.quiz-nav-action-secundaria::before{\n  background:linear-gradient(135deg,color-mix(in srgb,var(--primario) 78%,#fff),var(--primario));\n}\n.quiz-nav-action-principal::before{\n  background:linear-gradient(135deg,var(--primario),var(--primario2));\n}\n.quiz-nav-action:hover:not(:disabled){\n  transform:translateY(-2px);\n  filter:saturate(1.08) brightness(1.03);\n  box-shadow:0 14px 30px color-mix(in srgb,var(--primario) 32%,transparent),inset 0 1px 0 rgba(255,255,255,.28);\n}\n.quiz-nav-action:active:not(:disabled){transform:translateY(0) scale(.97)}\n.quiz-nav-action span{font-size:26px;font-weight:500;transition:transform .18s ease}\n.quiz-nav-action-secundaria:hover:not(:disabled) span{transform:translateX(-3px)}\n.quiz-nav-action-principal:hover:not(:disabled)>span:last-child{transform:translateX(3px)}\n.quiz-nav-action:disabled{\n  opacity:.42;\n  filter:grayscale(.28);\n  box-shadow:none;\n  cursor:not-allowed;\n}\n.quiz-nav-action.esta-cargando{opacity:.86;cursor:progress}\n.quiz-nav-spinner{\n  width:17px;height:17px;border-radius:50%;\n  border:2px solid rgba(255,255,255,.38);\n  border-top-color:#fff;\n  animation:quizNavSpin .7s linear infinite;\n}\n@keyframes quizNavSpin{to{transform:rotate(360deg)}}\n@media(max-width:420px){\n  .quiz-nav-actions{gap:9px;margin-top:16px}\n  .quiz-nav-action{min-height:50px;border-radius:16px;font-size:12px}\n  .quiz-nav-action span{font-size:23px}\n}\n@media(prefers-reduced-motion:reduce){\n  .quiz-nav-action,.quiz-nav-action span{transition:none}\n  .quiz-nav-spinner{animation-duration:1.4s}\n}\n
/* V46.33 · Barra de navegación inferior realmente rediseñada */
.quiz-rumbo-renovado{
  margin:18px 0 8px;
  padding:16px;
  border:1px solid color-mix(in srgb,var(--primario) 20%,var(--borde));
  border-radius:18px;
  background:linear-gradient(180deg,var(--card),color-mix(in srgb,var(--primarioLight) 35%,var(--card)));
  box-shadow:0 10px 26px rgba(15,23,42,.08);
}
.quiz-rumbo-renovado .quiz-rumbo-head{margin-bottom:10px}
.quiz-rumbo-renovado .quiz-rumbo-copy small{font-size:9px;letter-spacing:1.25px;color:var(--muted)}
.quiz-rumbo-renovado .quiz-rumbo-copy strong{font-size:19px;color:var(--text)}
.quiz-rumbo-renovado .quiz-rumbo-status{
  min-width:52px;padding:8px 10px;border-radius:999px;
  background:var(--primarioLight);color:var(--primario2);font-size:12px;font-weight:900;text-align:center;
}
.quiz-rumbo-renovado .quiz-rumbo-track{height:9px;border-radius:999px;background:color-mix(in srgb,var(--primario) 12%,var(--grisClaro));overflow:hidden}
.quiz-rumbo-renovado .quiz-rumbo-track span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--primario),var(--primario2));box-shadow:0 0 14px color-mix(in srgb,var(--primario) 40%,transparent);transition:width .3s ease}
.quiz-rumbo-renovado .quiz-rumbo-caption{margin:8px 0 12px;font-size:10px;color:var(--muted)}
.quiz-rumbo-renovado .quiz-progress-window-trigger{padding:0;border:0;background:transparent}
.quiz-rumbo-renovado .quiz-progress-window{display:flex;justify-content:center;gap:7px;min-height:36px}
.quiz-rumbo-renovado .quiz-progress-stats{justify-content:center;margin-top:10px;font-size:9px;color:var(--muted)}

.quiz-command-bar{
  position:sticky;
  bottom:calc(8px + env(safe-area-inset-bottom));
  z-index:60;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:stretch;
  gap:10px;
  margin:10px 0 4px;
  padding:10px;
  border:1px solid color-mix(in srgb,var(--primario) 20%,var(--borde));
  border-radius:24px;
  background:color-mix(in srgb,var(--card) 92%,transparent);
  -webkit-backdrop-filter:blur(18px) saturate(1.25);
  backdrop-filter:blur(18px) saturate(1.25);
  box-shadow:0 18px 42px rgba(15,23,42,.18),0 2px 8px rgba(15,23,42,.08);
}
.quiz-command-main{
  position:relative;
  min-width:0;
  min-height:62px;
  border:0;
  border-radius:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:10px 14px;
  color:#fff;
  cursor:pointer;
  overflow:hidden;
  isolation:isolate;
  box-shadow:0 10px 22px color-mix(in srgb,var(--primario) 28%,transparent),inset 0 1px 0 rgba(255,255,255,.25);
  transition:transform .14s ease,box-shadow .18s ease,opacity .18s ease,filter .18s ease;
}
.quiz-command-main::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(135deg,var(--primario),var(--primario2))}
.quiz-command-prev::before{background:linear-gradient(135deg,color-mix(in srgb,var(--primario) 78%,#fff),var(--primario2))}
.quiz-command-next::after{content:"";position:absolute;width:75px;height:75px;border-radius:50%;right:-28px;top:-34px;background:rgba(255,255,255,.16);pointer-events:none}
.quiz-command-main:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 14px 28px color-mix(in srgb,var(--primario) 34%,transparent),inset 0 1px 0 rgba(255,255,255,.3)}
.quiz-command-main:active:not(:disabled){transform:scale(.965)}
.quiz-command-main:disabled{opacity:.35;filter:saturate(.35);box-shadow:none;cursor:not-allowed}
.quiz-command-icon{font-size:34px;font-weight:300;line-height:1}
.quiz-command-copy{display:flex;flex-direction:column;align-items:flex-start;line-height:1.05}
.quiz-command-next .quiz-command-copy{align-items:flex-end}
.quiz-command-copy small{font-size:8px;letter-spacing:1.1px;opacity:.78;font-weight:800}
.quiz-command-copy b{font-size:14px;margin-top:4px}
.quiz-command-tools{display:grid;grid-template-columns:1fr 1fr;gap:7px;align-content:stretch}
.quiz-command-tool{
  width:58px;min-height:62px;padding:7px 5px;border:1px solid color-mix(in srgb,var(--primario) 22%,var(--borde));border-radius:16px;
  background:var(--card);color:var(--primario2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  cursor:pointer;box-shadow:0 5px 14px rgba(15,23,42,.08);transition:transform .14s ease,background .18s ease,border-color .18s ease;
}
.quiz-command-tool span{font-size:20px;line-height:1}.quiz-command-tool b{font-size:9px}.quiz-command-tool:active{transform:scale(.94)}
.quiz-command-tool:hover,.quiz-command-tool.activa{background:var(--primarioLight);border-color:var(--primario);color:var(--primario2)}
.quiz-command-main.esta-cargando .quiz-command-icon{display:none}
.quiz-command-main .quiz-nav-spinner{width:18px;height:18px}
@media(max-width:520px){
  .quiz-command-bar{gap:7px;padding:8px;border-radius:20px}
  .quiz-command-main{min-height:58px;border-radius:16px;padding:8px 9px;gap:6px}
  .quiz-command-icon{font-size:29px}.quiz-command-copy b{font-size:12px}.quiz-command-copy small{font-size:7px}
  .quiz-command-tools{gap:5px}.quiz-command-tool{width:48px;min-height:58px;border-radius:14px}.quiz-command-tool span{font-size:18px}.quiz-command-tool b{font-size:8px}
}
@media(max-width:365px){
  .quiz-command-bar{grid-template-columns:minmax(0,1fr) 46px minmax(0,1fr)}
  .quiz-command-tools{grid-template-columns:1fr}.quiz-command-tool{width:46px;min-height:27px;padding:3px}.quiz-command-tool span{font-size:14px}.quiz-command-tool b{display:none}
  .quiz-command-main{min-height:60px}.quiz-command-copy small{display:none}
}

/* V46.34 · Navegación enfocada y visible */
.quiz-progress-dock,.quiz-rumbo-panel,.quiz-rumbo-renovado,.quiz-command-bar{display:none!important}
.quiz-progress-mini{margin:16px 0 96px;padding:0 2px;position:relative}
.quiz-progress-mini-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.8px;text-transform:uppercase}
.quiz-progress-mini-head strong{font-size:12px;color:var(--primario2);letter-spacing:0;text-transform:none}
.quiz-progress-mini-track{height:7px;border-radius:999px;background:color-mix(in srgb,var(--primario) 14%,var(--grisClaro));overflow:hidden;box-shadow:inset 0 1px 2px rgba(15,23,42,.08)}
.quiz-progress-mini-track>span{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,var(--primario),var(--primario2));transition:width .28s ease}
.quiz-progress-mini-percent{position:absolute;right:2px;top:26px;font-size:9px;font-weight:900;color:var(--primario2);transform:translateY(7px)}
.quiz-switcher{position:sticky;bottom:calc(10px + env(safe-area-inset-bottom));z-index:80;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:9px;align-items:stretch;margin:0 -2px;padding:9px;border-radius:22px;border:1px solid color-mix(in srgb,var(--primario) 25%,var(--borde));background:color-mix(in srgb,var(--card) 94%,transparent);backdrop-filter:blur(16px) saturate(1.2);-webkit-backdrop-filter:blur(16px) saturate(1.2);box-shadow:0 16px 38px rgba(15,23,42,.2)}
.quiz-switcher-main{min-width:0;min-height:58px;border:0;border-radius:17px;padding:8px 12px;display:flex;align-items:center;justify-content:center;gap:9px;color:#fff;cursor:pointer;background:linear-gradient(135deg,var(--primario),var(--primario2));box-shadow:0 9px 20px color-mix(in srgb,var(--primario) 34%,transparent),inset 0 1px 0 rgba(255,255,255,.25);transition:transform .14s ease,filter .16s ease,opacity .16s ease,box-shadow .16s ease}
.quiz-switcher-prev{background:linear-gradient(135deg,color-mix(in srgb,var(--primario) 82%,#fff),var(--primario))}
.quiz-switcher-main:hover:not(:disabled){filter:brightness(1.04) saturate(1.08);transform:translateY(-1px)}
.quiz-switcher-main:active:not(:disabled){transform:scale(.965)}
.quiz-switcher-main:disabled{opacity:.34;box-shadow:none;cursor:not-allowed;filter:grayscale(.25)}
.quiz-switcher-main>span:not(.quiz-switcher-arrow){display:flex;flex-direction:column;line-height:1.02;align-items:flex-start}
.quiz-switcher-next>span:first-child{align-items:flex-end}
.quiz-switcher-main small{font-size:7px;letter-spacing:1px;font-weight:900;opacity:.78}
.quiz-switcher-main b{font-size:14px;margin-top:4px}
.quiz-switcher-arrow{font-size:32px;line-height:1;font-weight:300}
.quiz-switcher-tools{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.quiz-switcher-tool{width:54px;min-height:58px;border-radius:15px;border:1px solid color-mix(in srgb,var(--primario) 28%,var(--borde));background:var(--card);color:var(--primario2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer;box-shadow:0 5px 13px rgba(15,23,42,.08);transition:transform .14s ease,background .16s ease,border-color .16s ease}
.quiz-switcher-tool span{font-size:19px;line-height:1}.quiz-switcher-tool b{font-size:8px}
.quiz-switcher-tool:hover,.quiz-switcher-tool.activa{background:var(--primarioLight);border-color:var(--primario)}
.quiz-switcher-tool:active{transform:scale(.94)}
.quiz-switcher-main.esta-cargando .quiz-switcher-arrow{display:none}
.quiz-switcher-main .quiz-nav-spinner{width:18px;height:18px}
@media(max-width:430px){.quiz-switcher{gap:6px;padding:7px;border-radius:19px}.quiz-switcher-main{min-height:54px;border-radius:15px;padding:7px 8px;gap:5px}.quiz-switcher-main b{font-size:12px}.quiz-switcher-main small{display:none}.quiz-switcher-arrow{font-size:28px}.quiz-switcher-tool{width:44px;min-height:54px;border-radius:13px}.quiz-switcher-tool span{font-size:17px}.quiz-switcher-tool b{font-size:7px}.quiz-progress-mini{margin-bottom:88px}}
@media(max-width:350px){.quiz-switcher{grid-template-columns:minmax(0,1fr) 42px minmax(0,1fr)}.quiz-switcher-tools{grid-template-columns:1fr}.quiz-switcher-tool{width:42px;min-height:25px;padding:2px}.quiz-switcher-tool b{display:none}.quiz-switcher-tool span{font-size:13px}}

/* V46.37 · Contraste estable para la pregunta actual en el mapa claro. */
.quiz-map-number.actual{
  background:linear-gradient(135deg,var(--primario),var(--primario2));
  border-color:var(--primario2);
  color:#fff;
  text-shadow:0 1px 2px rgba(0,0,0,.65);
}

/* V46.57 · Centro de carga futurista del generador de preguntas */
.generador-ia-overlay{position:fixed;inset:0;z-index:2147483100;display:none;align-items:center;justify-content:center;padding:18px;background:radial-gradient(circle at 50% 35%,rgba(0,174,190,.2),transparent 42%),rgba(0,14,24,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.generador-ia-activo{overflow:hidden!important}
.generador-ia-overlay.visible{display:flex!important;visibility:visible!important;opacity:1!important}
.generador-ia-card{position:relative;isolation:isolate;overflow:hidden;width:min(480px,100%);padding:24px;border:1px solid rgba(103,236,241,.34);border-radius:26px;background:linear-gradient(155deg,rgba(8,35,48,.98),rgba(4,21,33,.98));color:#eaffff;text-align:center;box-shadow:0 28px 90px rgba(0,0,0,.5),0 0 42px rgba(39,205,215,.12)}
.generador-ia-grid{position:absolute;z-index:-1;inset:0;opacity:.22;background-image:linear-gradient(rgba(80,226,234,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(80,226,234,.16) 1px,transparent 1px);background-size:28px 28px;mask-image:linear-gradient(to bottom,#000,transparent 82%)}
.generador-ia-cabecera{display:flex;align-items:center;gap:8px;padding-bottom:16px;border-bottom:1px solid rgba(130,235,240,.14);color:#87f4f3;font-size:11px;letter-spacing:.13em}
.generador-ia-cabecera small{margin-left:auto;color:#fff;font-size:13px;font-weight:900;letter-spacing:.04em}
.generador-ia-pulso{width:8px;height:8px;border-radius:50%;background:#62f5c7;box-shadow:0 0 0 0 rgba(98,245,199,.55);animation:generadorPulso 1.5s infinite}
.generador-ia-nucleo{position:relative;width:122px;height:122px;margin:25px auto 19px;display:grid;place-items:center}
.generador-ia-nucleo:before,.generador-ia-nucleo:after,.generador-ia-nucleo>span{content:"";position:absolute;inset:0;border-radius:50%;border:1px solid rgba(102,238,242,.35)}
.generador-ia-nucleo:before{border-top-color:#71fbef;border-right-color:#71fbef;animation:generadorGiro 4s linear infinite}
.generador-ia-nucleo:after{inset:13px;border-left-color:#57aaff;border-bottom-color:#57aaff;animation:generadorGiro 3s linear infinite reverse}
.generador-ia-nucleo>span:nth-child(1){inset:27px;background:radial-gradient(circle,rgba(96,247,238,.25),rgba(20,100,132,.2) 54%,transparent 56%);border-color:rgba(119,247,240,.55);animation:generadorRespira 1.8s ease-in-out infinite}
.generador-ia-nucleo>span:nth-child(2){inset:-7px;border-style:dashed;opacity:.48;animation:generadorGiro 9s linear infinite reverse}
.generador-ia-nucleo>div{position:relative;z-index:2;font-size:36px;filter:drop-shadow(0 0 13px rgba(102,245,239,.62))}
.generador-ia-card h2{margin:0;color:#fff;font-size:24px;letter-spacing:-.02em}
.generador-ia-card>p{min-height:42px;margin:9px auto 18px;max-width:390px;color:#b9d9df;font-size:13px;line-height:1.55;text-wrap:balance}
.generador-ia-barra{position:relative;overflow:hidden;height:8px;border:1px solid rgba(119,239,242,.2);border-radius:999px;background:rgba(1,12,20,.76)}
.generador-ia-barra span{display:block;width:4%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#3a9dff,#5ff6db);box-shadow:0 0 16px rgba(95,246,219,.66);transition:width .45s ease}
.generador-ia-barra i{position:absolute;inset:0;width:38%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent);transform:translateX(-130%);animation:generadorBarrido 1.8s ease-in-out infinite}
.generador-ia-etapas{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:17px}
.generador-ia-etapas span{padding:8px 5px;border:1px solid rgba(139,213,220,.14);border-radius:10px;background:rgba(7,28,40,.65);color:#688d98;font-size:9px;font-weight:900;letter-spacing:.06em;transition:.25s ease}
.generador-ia-etapas span.activa{border-color:rgba(92,241,229,.5);background:rgba(34,156,167,.18);color:#91fff5;box-shadow:inset 0 0 16px rgba(53,221,216,.08)}
.generador-ia-etapas span.lista{color:#74e8bb;border-color:rgba(79,226,166,.28)}
.generador-ia-nota{display:block;margin-top:16px;color:#7598a2;font-size:10px}
.generador-ia-overlay.exito .generador-ia-nucleo>span:nth-child(1){background:radial-gradient(circle,rgba(80,245,168,.42),rgba(20,120,92,.24) 56%,transparent 58%)}
.generador-ia-overlay.error .generador-ia-nucleo>span:nth-child(1){background:radial-gradient(circle,rgba(255,113,113,.38),rgba(125,36,55,.25) 56%,transparent 58%)}
@keyframes generadorGiro{to{transform:rotate(360deg)}}
@keyframes generadorRespira{50%{transform:scale(1.09);filter:brightness(1.25)}}
@keyframes generadorPulso{70%{box-shadow:0 0 0 8px rgba(98,245,199,0)}}
@keyframes generadorBarrido{60%,100%{transform:translateX(300%)}}
@media (max-width:480px){.generador-ia-card{padding:20px 17px;border-radius:22px}.generador-ia-nucleo{width:104px;height:104px;margin:20px auto 16px}.generador-ia-card h2{font-size:21px}.generador-ia-etapas span{font-size:8px}}
@media (prefers-reduced-motion:reduce){.generador-ia-overlay *{animation:none!important;transition:none!important}}
