@font-face{font-family:Michroma;src:url('assets/michroma.woff2') format('woff2');font-display:swap}
:root{--navy:#06162d;--navy2:#0a2749;--blue:#145a8d;--silver:#d7e2ea;--ice:#f4f8fb;--muted:#90a6b8;--line:rgba(200,224,240,.15);--accent:#6ed2ff;--safe-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box}[hidden]{display:none!important}html{background:var(--navy);scroll-behavior:smooth}body{margin:0;color:var(--ice);font:16px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:radial-gradient(circle at 85% -5%,#17659b 0,transparent 35%),linear-gradient(160deg,#06162d 0%,#091e38 55%,#061426 100%);min-height:100vh}
button,a{font:inherit}.topbar{height:72px;padding:12px max(20px,env(safe-area-inset-left));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5;background:rgba(6,22,45,.88);backdrop-filter:blur(18px)}
.brand{display:flex;align-items:center;gap:10px;color:white;text-decoration:none;font:13px Michroma,sans-serif;letter-spacing:.08em}.brand img{width:44px;height:44px;object-fit:contain}.install,.round{border:1px solid var(--line);color:var(--ice);background:rgba(255,255,255,.07);border-radius:999px;padding:8px 14px}.round{width:42px;height:42px;padding:0;font-size:24px}
main{max-width:760px;margin:auto;padding:26px 20px calc(104px + var(--safe-bottom))}.view{display:none;animation:reveal .28s ease;scroll-margin-top:88px}.view.active{display:block}@keyframes reveal{from{opacity:0;transform:translateY(6px)}}
h1,h2,p{margin-top:0}h1{font-size:clamp(30px,8vw,44px);line-height:1.08;letter-spacing:-.035em}h2{font-size:18px}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:11px;color:var(--accent);font-weight:750}.hero{padding:12px 4px 26px}.hero>p:not(.eyebrow){max-width:590px;color:var(--silver);font-size:18px}.primary{border:0;border-radius:14px;padding:13px 19px;color:#02111f;background:linear-gradient(135deg,#d9f4ff,#69cdf9);font-weight:750;box-shadow:0 8px 30px rgba(57,177,231,.2)}.primary:disabled{opacity:.55}
.quick-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.quick-card,.daily-card,.feature-card,.profile-card,.settings{border:1px solid var(--line);background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.035));box-shadow:0 18px 50px rgba(0,0,0,.16);border-radius:20px}.quick-card{display:flex;flex-direction:column;text-align:left;color:white;padding:18px;min-height:160px}.quick-card>span{display:flex;align-items:center;height:30px;color:var(--accent);font-size:24px;margin-bottom:14px}.quick-card strong{display:block;min-height:48px}.quick-card small{display:block;color:var(--muted);margin-top:4px}.daily-card{padding:22px;margin-top:28px}.daily-card>p,.feature-card p,.profile-card p{color:var(--muted)}.daily-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:12px 0}.daily-actions .primary{grid-column:1/-1}.daily-step{min-height:46px;padding:9px 10px;border:1px solid var(--line);border-radius:12px;color:var(--silver);background:rgba(255,255,255,.07);display:flex;align-items:center;justify-content:center;text-align:center;text-decoration:none;font-weight:650}.daily-step:disabled{opacity:.45}.daily-step:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.daily-text{margin:18px 0 8px;padding:18px;border:1px solid var(--line);border-radius:16px;background:rgba(0,0,0,.12);max-height:55vh;overflow:auto}.daily-text h3{font-size:20px;margin-bottom:16px}.daily-text p{color:var(--silver);line-height:1.7}.daily-text p:last-child{margin-bottom:0}.lesson-index{display:grid;gap:7px}.lesson-index button{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.05);color:var(--silver);text-align:left}.lesson-index button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.section-head{display:flex;align-items:center;justify-content:space-between}.notice{padding:12px 14px;border-left:3px solid var(--accent);background:rgba(110,210,255,.08);color:var(--silver);font-size:14px;margin:20px 0}.notice.error{border-color:#ff9d9d;color:#ffd4d4}.search-box{display:block;margin:4px 0 14px}.search-box input{width:100%;padding:13px 15px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.07);color:white;font:inherit;outline:none}.search-box input:focus{border-color:var(--accent)}.search-box input::placeholder{color:var(--muted)}.filter-bar{display:flex;gap:8px;overflow:auto;padding:2px 1px 12px}.filter{white-space:nowrap;border:1px solid var(--line);border-radius:999px;padding:8px 14px;color:var(--silver);background:rgba(255,255,255,.05)}.filter.active{color:var(--accent);background:rgba(255,255,255,.05);border-color:var(--accent);font-weight:750}.list{display:grid;gap:12px}.media-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:16px;border-bottom:1px solid var(--line)}.media-card h2,.media-card p{margin:0}.media-card p{color:var(--muted);font-size:14px}.play{width:46px;height:46px;border-radius:50%;border:1px solid rgba(110,210,255,.35);background:rgba(110,210,255,.12);color:var(--accent)}.favorite{border:0;background:transparent;color:var(--muted);font-size:25px}.favorite[aria-pressed="true"]{color:var(--accent)}.doc{min-width:48px;color:var(--accent);font-size:12px;font-weight:800;text-align:center}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.collection-list{display:grid;gap:14px}.feature-card{display:flex;gap:18px;padding:22px;margin:0;color:white;text-decoration:none}.feature-card:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.feature-icon{font-size:34px;color:var(--accent)}.group-card{padding:22px;border:1px solid var(--line);background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.035));box-shadow:0 18px 50px rgba(0,0,0,.16);border-radius:20px}.group-card h2{font-size:22px;margin-bottom:14px}.group-image{display:block;width:100%;max-height:360px;object-fit:cover;border-radius:15px;margin:0 0 16px;background:rgba(255,255,255,.04)}.group-description{color:var(--silver);line-height:1.7}.group-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:16px}.group-actions button,.group-actions a{padding:9px 14px;border:1px solid rgba(110,210,255,.35);border-radius:12px;color:var(--accent);background:rgba(110,210,255,.08);text-decoration:none;font-weight:700}.static-link{color:white;text-decoration:none;margin-top:18px}.profile-card{text-align:center;padding:28px}.avatar{width:104px;height:104px;border-radius:50%;display:grid;place-items:center;margin:0 auto 16px;background:linear-gradient(135deg,rgba(122,215,255,.2),rgba(22,78,120,.35));overflow:hidden}.avatar img{width:125%;height:125%;max-width:none;object-fit:cover}.profile-card .primary{margin-top:20px}.local-library{margin-top:26px}.compact-list{display:grid;gap:8px}.compact-item{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}.compact-item strong,.compact-item small{display:block}.compact-item small,.empty-copy{color:var(--muted)}.compact-item button{border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.07);color:var(--accent);padding:8px 12px}.settings{margin-top:22px;overflow:hidden}.settings button{display:grid;grid-template-columns:30px 1fr auto;width:100%;padding:16px;border:0;border-bottom:1px solid var(--line);background:transparent;color:white;text-align:left}.settings button:last-child{border-bottom:0}.settings button:disabled{opacity:.6}
.player{position:fixed;z-index:7;left:0;right:0;bottom:66px;display:grid;grid-template-columns:minmax(90px,1fr) auto minmax(150px,360px) 34px;align-items:center;gap:10px;padding:10px 14px;background:rgba(8,31,56,.98);border-top:1px solid var(--line);box-shadow:0 -12px 35px rgba(0,0,0,.3)}.player-copy{min-width:0}.player-copy strong,.player-copy small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-copy small{color:var(--muted)}.player-actions{display:flex;gap:5px}.player-actions button{min-width:34px;height:34px;padding:0 8px;border:1px solid var(--line);border-radius:999px;color:var(--silver);background:rgba(255,255,255,.07);font-size:13px}.player audio{width:100%;height:38px}.player-close{border:0;background:transparent;color:var(--silver);font-size:28px}.bottom-nav{position:fixed;z-index:6;bottom:0;left:0;right:0;display:grid;grid-template-columns:repeat(6,1fr);padding:8px 6px calc(7px + var(--safe-bottom));background:rgba(4,16,32,.94);border-top:1px solid var(--line);backdrop-filter:blur(20px)}.bottom-nav a{display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--muted);text-decoration:none;font-size:10px}.bottom-nav a>.bottom-nav-icon{font-size:20px;line-height:1.2}.bottom-nav a.active{color:var(--accent)}
@media(min-width:700px){.quick-grid{grid-template-columns:repeat(4,1fr)}.quick-card{min-height:160px}.bottom-nav{left:50%;right:auto;transform:translateX(-50%);width:min(760px,100%);border:1px solid var(--line);border-bottom:0;border-radius:22px 22px 0 0}}
@media(max-width:700px){.player{grid-template-columns:1fr 34px;bottom:67px}.player-copy{grid-column:1;grid-row:1}.player-close{grid-column:2;grid-row:1}.player-actions{grid-column:1/-1;grid-row:2;justify-content:center}.player audio{grid-column:1/-1;grid-row:3}}
@media(max-width:460px){.daily-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.group-card{padding:18px}}

/* v0.6.2: alignment and filter-state corrections */
.filter,.filter.active{background-color:rgba(255,255,255,.05);background-image:none}
.avatar img{display:block;object-position:50% 50%;transform:translateZ(0)}

/* v0.6.3: deterministic compact group previews and visual alignment */
.group-teaser{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:5;overflow:hidden}
.filter,.filter.active{background:rgba(255,255,255,.10)}
.avatar{display:flex;align-items:center;justify-content:center}
.avatar img{width:100%;height:100%;margin:0;object-fit:cover;object-position:center center;transform:none}

/* v0.6.4: all audio filters share exactly the same visual treatment */
.filter.active{color:var(--silver);border-color:var(--line);font-weight:400}

/* v0.6.4: practice heading and controls use the common blue accent */
.daily-card>.eyebrow{color:var(--accent)}
.daily-actions .daily-step,.daily-actions .primary,.lesson-index button{border:1px solid var(--accent)}

/* v0.6.5: viewport-fixed background, independent of list length */
body{position:relative;isolation:isolate;background:var(--navy)}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 85% -5%,#17659b 0,transparent 35%),linear-gradient(160deg,#06162d 0%,#091e38 55%,#061426 100%)}

/* v0.6.6: index entries keep their original subtle border */
.lesson-index button{border-color:var(--line)}

/* v0.7.0: secure account and chat access */
.account-actions{display:grid;gap:10px;margin-top:20px}
.account-actions .primary,.account-actions .daily-step{margin:0;min-width:min(100%,260px);text-decoration:none}
.account-actions .primary{display:flex;align-items:center;justify-content:center}
@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}

main.chat-mode{max-width:none;margin:0;padding:0;height:calc(100vh - 134px - var(--safe-bottom));height:calc(100dvh - 134px - var(--safe-bottom));overflow:hidden}
.chat-view.active{display:flex;position:relative;height:100%}
.chat-view iframe{width:100%;height:100%;border:0;background:#071426}
.chat-view .notice{position:absolute;z-index:1;inset:0;display:grid;place-items:center;margin:0;border:0;border-radius:0;background:#071426;color:var(--muted)}
.chat-view .notice[hidden]{display:none}
@media(max-width:460px){.bottom-nav a{font-size:9px}.bottom-nav a>.bottom-nav-icon{font-size:18px}}

.admin-mode-badge{margin-left:auto;margin-right:10px;padding:7px 12px;border:1px solid #69b9ec;border-radius:999px;color:#bfe8ff;background:#123b5d;font-size:12px;font-weight:700;letter-spacing:.04em}

html{scrollbar-width:thin;scrollbar-color:#315b7d #071426}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:#071426}
::-webkit-scrollbar-thumb{background:#315b7d;border:2px solid #071426;border-radius:999px}
::-webkit-scrollbar-thumb:hover{background:#4d9cd4}

/* iOS/touch: evitar artefactos de superposicion de la cabecera durante scroll */
@media (hover:none) and (pointer:coarse){
  .topbar{
    background:#06162d;
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
  }
}

/* v0.7.2: titulo de bienvenida mas fino y estilizado */
.hero h1{
  font-weight:300;
}
@media(max-width:460px){
  .hero h1{
    font-size:clamp(27px,7.2vw,34px);
    letter-spacing:-.025em;
  }
}

/* v0.7.3: scroll unico de pagina para el texto de las lecciones */
.daily-text{
  max-height:none;
  overflow:visible;
}

/* v0.7.4: titulos principales interiores mas finos */
.view > h1,
.section-head h1{
  font-weight:300;
}

/* v0.7.5: nombres de los grupos con tipografia mas fina */
.group-card h2{
  font-weight:300;
}

/* v0.7.6: reservar espacio para el reproductor cuando esta visible */
body:has(#player:not([hidden])) main:not(.chat-mode){
  padding-bottom:calc(270px + var(--safe-bottom));
}

/* v0.7.7: reproductor siempre por encima de la navegacion inferior */
@media(max-width:700px){
  .player{
    bottom:calc(67px + var(--safe-bottom));
  }
}


/* v0.8.0: descarga individual de audios para uso sin conexion */
.media-card{
  grid-template-columns:auto 1fr auto auto;
}
.download-audio{
  width:38px;
  height:38px;
  padding:0;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,255,255,.07);
  color:var(--accent);
  font-size:20px;
  line-height:1;
}
.download-audio:disabled{
  opacity:.5;
}

/* v0.8.1: controles compactos de audio en pantallas moviles */
.download-audio{
  width:32px;
  height:32px;
  min-width:32px;
  font-size:18px;
  flex:none;
}
.favorite{
  width:32px;
  min-width:32px;
  padding:0;
}
@media(max-width:460px){
  .media-card{
    grid-template-columns:46px minmax(0,1fr) 32px 32px;
    gap:8px;
    padding-left:8px;
    padding-right:8px;
  }
  .media-card > div{
    min-width:0;
  }
}

/* v0.8.2: iconos de descarga mas visibles e indicador animado */
.download-audio,
.download-filter{
  font-weight:900;
}

.download-filter{
  font-size:20px;
  line-height:1;
  min-width:42px;
}

.download-audio.is-downloading{
  font-size:0;
}

.download-audio.is-downloading::after{
  content:"";
  display:block;
  width:15px;
  height:15px;
  margin:auto;
  border:2px solid rgba(110,210,255,.30);
  border-top-color:var(--accent);
  border-radius:50%;
  animation:download-spin .75s linear infinite;
}

@keyframes download-spin{
  to{transform:rotate(360deg)}
}

/* v0.8.3: icono de descarga dibujado con trazo grueso */
.download-audio:not(.is-downloading),
.download-filter{
  font-size:0;
}

.download-audio:not(.is-downloading)::before,
.download-filter::before{
  content:"";
  display:block;
  width:14px;
  height:16px;
  margin:auto;
  background:
    linear-gradient(var(--accent),var(--accent)) center top / 3px 11px no-repeat,
    linear-gradient(45deg,transparent 46%,var(--accent) 47% 60%,transparent 61%) left bottom / 8px 8px no-repeat,
    linear-gradient(-45deg,transparent 46%,var(--accent) 47% 60%,transparent 61%) right bottom / 8px 8px no-repeat;
}

.download-audio:not(.is-downloading)[aria-label^="Eliminar"]::before{
  content:"✓";
  width:auto;
  height:auto;
  background:none;
  color:var(--accent);
  font-size:20px;
  font-weight:900;
  line-height:1;
}

/* v0.8.4: progreso real de descarga */
.download-audio.is-downloading::after{
  width:18px;
  height:18px;
  border:0;
  border-radius:50%;
  background:conic-gradient(
    var(--accent) 0 var(--download-progress,0deg),
    rgba(110,210,255,.22) var(--download-progress,0deg) 360deg
  );
  animation:none;
  box-shadow:inset 0 0 0 4px rgba(6,22,45,.92);
}

/* v0.8.5: corazon de favoritos mas redondeado y uniforme */
.favorite{
  font-family:Arial,"Helvetica Neue",sans-serif;
  font-size:27px;
  font-weight:400;
  line-height:1;
  transform:scaleX(1.12);
}

/* v0.8.6: progreso de descarga a tamano completo */
.download-audio.is-downloading::after{
  width:28px;
  height:28px;
  box-shadow:inset 0 0 0 5px rgba(6,22,45,.92);
}

/* v0.8.7: progreso persistente y a circulo completo */
.download-audio.is-downloading{
  padding:0;
  border-color:transparent;
  background:
    conic-gradient(
      var(--accent) 0 var(--download-progress,0deg),
      rgba(110,210,255,.20) var(--download-progress,0deg) 360deg
    );
}
.download-audio.is-downloading::after{
  width:22px;
  height:22px;
  margin:auto;
  background:var(--navy);
  border-radius:50%;
  box-shadow:none;
}

/* v0.8.8: indicador de progreso limpio y uniforme */
.download-audio.is-downloading{
  width:32px;
  height:32px;
  min-width:32px;
  padding:0;
  border:0;
  border-radius:50%;
  background:conic-gradient(
    var(--accent) 0 var(--download-progress,0deg),
    rgba(110,210,255,.16) var(--download-progress,0deg) 360deg
  );
}

.download-audio.is-downloading::after{
  content:"";
  display:block;
  width:20px;
  height:20px;
  margin:6px;
  border:0;
  border-radius:50%;
  background:var(--navy);
  box-shadow:none;
  animation:none;
}

/* v0.8.9: filtro de audios activo claramente identificado */
.audio-filters .filter.active{
  color:var(--accent);
  background:rgba(110,210,255,.14);
  border-color:var(--accent);
  box-shadow:0 0 0 1px rgba(110,210,255,.18);
}

/* v0.9.0: estado visible del filtro de audios seleccionado */
.filter-bar .filter.active{
  color:var(--accent);
  background:rgba(110,210,255,.16);
  border-color:var(--accent);
  box-shadow:0 0 0 1px rgba(110,210,255,.22);
  font-weight:700;
}

/* Mi espacio v72 - tarjetas de accesos privados */
.private-card{
  background:rgba(255,255,255,.06);
  border-radius:18px;
  padding:16px;
  margin:14px 0;
  border:1px solid rgba(255,255,255,.12);
}

.private-card h3{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 12px;
  font-size:18px;
  font-weight:500;
}

.private-card h3 span{
  width:28px;
  height:28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:rgba(255,255,255,.12);
}

.private-items{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.private-item{
  padding:10px 12px;
  border-radius:12px;
  background:rgba(255,255,255,.08);
  font-size:15px;
}

.private-empty{
  opacity:.65;
  font-size:14px;
}


/* Mi espacio v72 - tarjetas de acceso privadas con efectos */

.access-card{
  display:flex;
  align-items:center;
  gap:14px;
  padding:18px;
  margin:14px 0;
  border-radius:22px;
  background:linear-gradient(135deg,rgba(255,255,255,.10),rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.16);
  box-shadow:
    0 8px 24px rgba(0,0,0,.18),
    inset 0 0 18px rgba(255,255,255,.03);
  transition:
    transform .25s ease,
    box-shadow .25s ease,
    border-color .25s ease;
  cursor:pointer;
}

.access-card:hover{
  transform:translateY(-3px);
  border-color:rgba(110,210,255,.45);
  box-shadow:
    0 14px 30px rgba(0,0,0,.25),
    0 0 18px rgba(110,210,255,.12);
}

.access-icon{
  width:46px;
  height:46px;
  flex:none;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:rgba(110,210,255,.12);
  font-size:24px;
}

.access-content{
  flex:1;
}

.access-content h3{
  margin:0 0 4px;
  font-size:18px;
  font-weight:500;
}

.access-content p{
  margin:0 0 5px;
  opacity:.75;
  font-size:14px;
}

.access-content small{
  opacity:.65;
  font-size:13px;
}

.access-arrow{
  font-size:24px;
  opacity:.7;
  transition:transform .25s ease;
}

.access-card:hover .access-arrow{
  transform:translateX(4px);
}


/* Mi espacio v72 - accesos principales minimalistas */

.access-card{
  min-height:72px;
  padding:18px 20px;
}

.access-icon{
  width:48px;
  height:48px;
  font-size:26px;
  background:rgba(110,210,255,.14);
  box-shadow:0 0 18px rgba(110,210,255,.08);
}

.access-content h3{
  margin:0;
  font-size:19px;
  font-weight:400;
  letter-spacing:-.01em;
}

.private-card.access-card:hover{
  transform:translateY(-2px);
}


/* v0.9.1: Mi espacio - tarjetas privadas interactivas */
button.private-card.access-card{
  width:100%;
  appearance:none;
  -webkit-appearance:none;
  font:inherit;
  color:var(--ice);
  text-align:left;
}

button.private-card.access-card .access-content{
  min-width:0;
}

button.private-card.access-card .access-content h3{
  color:var(--ice);
}

button.private-card.access-card .access-icon{
  color:var(--accent);
}

button.private-card.access-card .access-arrow{
  margin-left:auto;
  color:var(--silver);
}

button.private-card.access-card:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:3px;
}

#privateList{
  margin-top:18px;
}

#privateBack{
  width:max-content;
  margin:4px 0 20px;
}

/* v0.9.2: iconos vectoriales de Mi espacio */
.access-icon svg{
  width:26px;
  height:26px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* v0.9.3: contenidos privados de grupos */
.private-media-item{
  display:flex;
  align-items:center;
  gap:14px;
}

.private-media-item .access-content h3{
  margin:0 0 5px;
  font-weight:400;
}

.private-media-item .access-content p{
  margin:0;
  color:var(--muted);
  font-size:13px;
}

/* v0.9.4: flechas privadas centradas y con mayor presencia */
.access-card .access-arrow{
  display:flex;
  align-self:center;
  align-items:center;
  justify-content:center;
  min-width:22px;
  height:1em;
  line-height:1;
  font-size:30px;
  font-weight:700;
  transform:translateY(-1px);
}

#privateList .access-content p{
  margin:5px 0 0;
  color:var(--muted);
  font-size:13px;
}

/* v0.9.5: botón volver e interacción de medios privados */
#privateBack{
  gap:8px;
}

.private-back-icon{
  width:20px;
  height:20px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:none;
}

.private-back-icon svg{
  display:block;
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

button.private-media-item{
  width:100%;
  appearance:none;
  -webkit-appearance:none;
  color:var(--ice);
  font:inherit;
  text-align:left;
  border:1px solid rgba(255,255,255,.12);
}

.private-media-item.is-action{
  cursor:pointer;
}

.private-media-item.is-action:hover{
  border-color:rgba(110,210,255,.45);
}

/* v0.9.6: reproductor interno de vídeo privado */
.video-player-panel{
  position:fixed;
  inset:0;
  z-index:20;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(2,10,20,.88);
  backdrop-filter:blur(10px);
}

.video-player-box{
  width:min(100%,960px);
  border:1px solid var(--line);
  border-radius:20px;
  overflow:hidden;
  background:#020b16;
  box-shadow:0 24px 80px rgba(0,0,0,.55);
}

.video-player-head{
  min-height:58px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:10px 14px 10px 18px;
  color:var(--ice);
}

.video-player-head strong{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:500;
}

#closeVideoPlayer{
  flex:none;
  width:40px;
  height:40px;
  border:0;
  background:transparent;
  color:var(--silver);
  font-size:30px;
  line-height:1;
}

#videoPlayer{
  display:block;
  width:100%;
  max-height:calc(100dvh - 150px);
  background:#000;
}

@media(max-width:700px){
  .video-player-panel{
    padding:10px;
  }

  .video-player-box{
    border-radius:14px;
  }
}

/* Evita mostrar Inicio durante la resolución inicial del hash */

/* Entrada directa a Mi espacio al volver del acceso */

/* Pantalla de arranque de la app */
.app-boot{
  position:fixed;
  inset:0;
  z-index:100;
  display:grid;
  place-items:center;
  background:linear-gradient(160deg,#06162d 0%,#091e38 55%,#061426 100%);
  transition:opacity .2s ease, visibility .2s ease;
}
.app-boot img{
  width:110px;
  height:110px;
  object-fit:contain;
}
.app-boot.hidden{
  opacity:0;
  visibility:hidden;
}

/* Evita el marco de foco del contenedor principal al cambiar de vista */
#app:focus{
  outline:none;
}

/* Ajuste visual formulario acceso interno PWA */
.login-card{
  max-width:520px;
  margin:0 auto;
  padding:34px 28px;
}

.login-card form{
  display:grid;
  gap:16px;
  margin-top:24px;
}

.login-card input{
  width:100%;
  min-height:54px;
  padding:14px 16px;
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(255,255,255,.07);
  color:white;
  font:inherit;
  font-size:16px;
  outline:none;
}

.login-card input:focus{
  border-color:var(--accent);
}

.login-card button{
  min-height:54px;
  margin-top:8px;
  font-size:16px;
}

@media(max-width:480px){
  .login-card{
    padding:28px 20px;
  }
}

/* Pulido visual acceso interno PWA */
.login-card h1{
  font-weight:300;
  letter-spacing:-.02em;
  margin-bottom:8px;
}

.login-card input{
  transition:border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

.login-card input:focus{
  background:rgba(255,255,255,.11);
  box-shadow:0 0 0 3px rgba(110,210,255,.12);
}

#appLoginSubmit{
  transition:opacity .2s ease, transform .2s ease, background .2s ease;
}

#appLoginSubmit:disabled{
  opacity:.75;
  cursor:wait;
}

#appLoginSubmit.is-verifying{
  position:relative;
  overflow:hidden;
}

#appLoginSubmit.is-verifying::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.25),transparent);
  transform:translateX(-100%);
  animation:loginSweep 1.2s ease-in-out infinite;
}

@keyframes loginSweep{
  to{
    transform:translateX(100%);
  }
}

#appLoginStatus{
  min-height:22px;
  margin-top:16px;
}

/* chat-iframe-fixed-v1
   La página de la PWA no se desplaza mientras está abierto el chat. */
body:has(main.chat-mode){
  height:100dvh;
  overflow:hidden;
}

main.chat-mode{
  position:fixed;
  top:72px;
  left:0;
  right:0;
  bottom:calc(67px + var(--safe-bottom));
  width:100%;
  height:auto;
  min-height:0;
  overflow:hidden;
}

.chat-view.active,
.chat-view iframe{
  width:100%;
  height:100%;
  min-height:0;
  overflow:hidden;
}


/* MENTE UNO: PERMISO NOTIFICACIONES CHAT */

.chat-notification-permission{
  position:fixed;
  inset:0;
  z-index:20000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(2,10,22,.82);
  backdrop-filter:blur(7px);
}

.chat-notification-permission-card{
  width:min(440px,100%);
  padding:24px;
  border:1px solid var(--line);
  border-radius:20px;
  background:#0b2038;
  box-shadow:0 24px 70px rgba(0,0,0,.48);
}

.chat-notification-permission-card h2{
  margin:0 0 12px;
  font-size:21px;
}

.chat-notification-permission-card p{
  color:var(--muted);
  line-height:1.55;
}

.chat-notification-permission-actions{
  display:flex;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:9px;
  margin-top:20px;
}

.chat-notification-permission-actions button{
  min-height:44px;
  padding:10px 15px;
  border:1px solid var(--line);
  border-radius:12px;
  background:rgba(255,255,255,.06);
  color:white;
  font-weight:700;
}

.chat-notification-permission-actions .primary{
  border-color:rgba(110,210,255,.45);
  background:rgba(110,210,255,.14);
  color:var(--accent);
}

.chat-notification-permission-card small{
  display:block;
  min-height:20px;
  margin-top:12px;
  color:var(--accent);
}

/* MENTE UNO: RECORDATORIOS DE LAS LECCIONES */

.lesson-alarm-button{
  border-color:rgba(110,210,255,.55)!important;
}

.lesson-alarm-dialog{
  position:fixed;
  inset:0;
  z-index:21000;
  overflow:auto;
  padding:18px;
  background:rgba(2,10,22,.86);
  backdrop-filter:blur(8px);
}

.lesson-alarm-card{
  width:min(580px,100%);
  margin:0 auto;
  padding:24px;
  border:1px solid var(--line);
  border-radius:22px;
  background:#0b2038;
  box-shadow:0 24px 70px rgba(0,0,0,.5);
}

.lesson-alarm-head,
.lesson-alarm-list-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}

.lesson-alarm-head h2,
.lesson-alarm-list-head h3,
.lesson-alarm-card form h3{
  margin:0;
}

.lesson-alarm-head .eyebrow{
  margin-bottom:5px;
}

.lesson-alarm-head>[data-alarm-close]{
  width:42px;
  height:42px;
  flex:0 0 auto;
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--silver);
  background:rgba(255,255,255,.06);
  font-size:27px;
  line-height:1;
}

.lesson-alarm-explanation{
  margin:16px 0 22px;
  color:var(--muted);
}

.lesson-alarm-card form{
  display:grid;
  gap:16px;
  padding:20px;
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(0,0,0,.12);
}

.lesson-alarm-modes{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.lesson-alarm-modes button,
.lesson-alarm-list-head button,
.lesson-alarm-item-actions button{
  min-height:42px;
  padding:9px 13px;
  border:1px solid var(--line);
  border-radius:12px;
  color:var(--silver);
  background:rgba(255,255,255,.06);
  font-weight:700;
}

.lesson-alarm-modes button.active{
  border-color:var(--accent);
  color:var(--accent);
  background:rgba(110,210,255,.11);
}

.lesson-alarm-field{
  display:grid;
  gap:7px;
}

.lesson-alarm-field>span,
.lesson-alarm-days legend{
  color:var(--silver);
  font-size:14px;
  font-weight:700;
}

.lesson-alarm-field input,
.lesson-alarm-field select{
  width:100%;
  min-height:46px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:12px;
  outline:none;
  color:white;
  color-scheme:dark;
  background:#102b49;
  font:inherit;
}

.lesson-alarm-field input:focus,
.lesson-alarm-field select:focus{
  border-color:var(--accent);
}

.lesson-alarm-clock{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:center;
  gap:7px;
  width:100%;
}

.lesson-alarm-clock select{
  min-width:0;
  width:100%;
  text-align:center;
  text-align-last:center;
  font-size:18px;
  font-weight:700;
}

.lesson-alarm-clock b{
  color:var(--accent);
  font-size:21px;
}

.lesson-alarm-days{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:7px;
  margin:0 0 16px;
  padding:0;
  border:0;
}

.lesson-alarm-days legend{
  grid-column:1/-1;
  margin-bottom:7px;
}

.lesson-alarm-days label{
  position:relative;
}

.lesson-alarm-days input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.lesson-alarm-days span{
  display:grid;
  place-items:center;
  min-height:42px;
  border:1px solid var(--line);
  border-radius:12px;
  color:var(--muted);
  background:rgba(255,255,255,.05);
  font-weight:750;
}

.lesson-alarm-days input:checked+span{
  border-color:var(--accent);
  color:var(--accent);
  background:rgba(110,210,255,.12);
}

.lesson-alarm-days input:focus-visible+span{
  outline:2px solid var(--accent);
  outline-offset:2px;
}

.lesson-alarm-interval{
  display:grid;
  gap:14px;
}

.lesson-alarm-time-range{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.lesson-alarm-save{
  width:100%;
  margin:2px 0 0;
}

.lesson-alarm-status{
  min-height:24px;
  margin:0;
  color:var(--accent);
  font-size:14px;
}

.lesson-alarm-list-head{
  align-items:center;
  margin:26px 0 10px;
}

.lesson-alarm-list-head button{
  min-height:38px;
  color:#ffd4d4;
  font-size:13px;
}

.lesson-alarm-list{
  display:grid;
  gap:10px;
}

.lesson-alarm-empty{
  margin:0;
  padding:15px 0;
  color:var(--muted);
}

.lesson-alarm-item{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  padding:15px;
  border:1px solid var(--line);
  border-radius:15px;
  background:rgba(255,255,255,.045);
}

.lesson-alarm-item strong,
.lesson-alarm-item small,
.lesson-alarm-item span{
  display:block;
}

.lesson-alarm-item small{
  margin:4px 0;
  color:var(--accent);
}

.lesson-alarm-item span{
  color:var(--muted);
  overflow-wrap:anywhere;
}

.lesson-alarm-item-actions{
  display:flex;
  flex-direction:column;
  gap:7px;
}

.lesson-alarm-item-actions button{
  min-height:36px;
  padding:7px 10px;
  font-size:13px;
}

.lesson-alarm-item-actions button:last-child{
  color:#ffd4d4;
}

@media(max-width:520px){
  .lesson-alarm-dialog{padding:0}
  .lesson-alarm-card{min-height:100%;border:0;border-radius:0;padding:20px 16px calc(24px + var(--safe-bottom))}
  .lesson-alarm-card form{padding:16px}
  .lesson-alarm-item{grid-template-columns:1fr}
  .lesson-alarm-item-actions{flex-direction:row}
}

/* MENTE UNO: TEXTOS DEL PIE MÁS VISIBLES */

.bottom-nav a{
    gap:1px;
}

.bottom-nav a > .bottom-nav-icon{
    font-size:20px !important;
    line-height:1.15 !important;
}

.bottom-nav a > .bottom-nav-label{
    display:block;
    max-width:100%;
    font-family:system-ui,-apple-system,"Segoe UI",sans-serif !important;
    font-size:15px !important;
    font-weight:600 !important;
    line-height:1 !important;
    letter-spacing:-0.25px;
    white-space:nowrap;
}

.bottom-nav a[href="#materiales"] > .bottom-nav-label,
.bottom-nav a[href="#perfil"] > .bottom-nav-label{
    font-size:14px !important;
}

@media(max-width:460px){
    .bottom-nav a > .bottom-nav-icon{
        font-size:18px !important;
    }
}

/* Textos del Curso: biblioteca, búsqueda global y lector */
.course-texts-view{min-width:0}.course-texts-head{gap:16px}.course-texts-head>div{min-width:0}.course-intro{color:var(--silver);max-width:620px}.course-search-box{position:sticky;top:84px;z-index:4;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;margin:20px 0 14px;padding:4px 7px 4px 15px;border:1px solid rgba(110,210,255,.34);border-radius:17px;background:rgba(6,22,45,.97);box-shadow:0 12px 35px rgba(0,0,0,.22);color:var(--accent);backdrop-filter:blur(18px)}.course-search-box:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(110,210,255,.1),0 12px 35px rgba(0,0,0,.22)}.course-search-box input{min-width:0;width:100%;padding:12px 0;border:0;outline:0;background:transparent;color:var(--ice);font:inherit}.course-search-box input::placeholder{color:var(--muted)}.course-search-box button{width:38px;height:38px;border:0;border-radius:50%;background:rgba(255,255,255,.08);color:var(--silver);font-size:24px;line-height:1}.course-book-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.course-book-card{display:grid;grid-template-columns:52px minmax(0,1fr);align-items:center;gap:14px;min-width:0;padding:18px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.035));color:var(--ice);text-align:left;box-shadow:0 16px 42px rgba(0,0,0,.14)}.course-book-card:focus-visible,.course-result:focus-visible,.course-section-list button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.course-book-icon{display:grid;place-items:center;width:52px;height:52px;border:1px solid rgba(110,210,255,.36);border-radius:16px;background:rgba(110,210,255,.1);color:var(--accent);font-weight:800}.course-book-card strong,.course-book-card small{display:block;overflow-wrap:anywhere}.course-book-card small{margin-top:3px;color:var(--muted);font-size:12px}.course-search-results{display:grid;gap:10px}.course-result{display:grid;gap:5px;width:100%;min-width:0;padding:17px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.055);color:var(--ice);text-align:left}.course-result-meta{color:var(--accent);font-size:11px;font-weight:750;letter-spacing:.04em}.course-result strong{font-size:15px;overflow-wrap:anywhere}.course-result-snippet{color:var(--silver);font-size:14px;line-height:1.55;overflow-wrap:anywhere}.course-texts-view mark{padding:0 .08em;border-radius:3px;background:#ffe28a;color:#142235}.course-reader-bar{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:14px;margin:8px 0 20px}.course-reader-bar .daily-step{min-width:88px}.course-reader-bar h2,.course-reader-bar p{margin-bottom:4px;overflow-wrap:anywhere}.course-reader-bar h2{font-size:clamp(20px,5vw,28px);line-height:1.2}.course-section-list{display:grid;gap:7px}.course-section-list h3{margin:22px 0 5px;color:var(--accent);font-size:12px;letter-spacing:.1em;text-transform:uppercase}.course-section-list h3:first-child{margin-top:0}.course-section-list button{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;width:100%;min-width:0;padding:13px 14px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.05);color:var(--silver);text-align:left}.course-section-list strong{overflow-wrap:anywhere}.course-section-list small{color:var(--muted);font-size:11px}.course-reader-body{overflow:hidden;border:1px solid var(--line);border-radius:20px;background:rgba(0,0,0,.12)}.course-passage{display:grid;grid-template-columns:76px minmax(0,1fr);gap:16px;min-width:0;padding:20px;border-bottom:1px solid var(--line);scroll-margin-top:170px}.course-passage:last-child{border-bottom:0}.course-citation{color:var(--accent);font-size:11px;font-weight:750;overflow-wrap:anywhere}.course-passage-copy{min-width:0}.course-passage-copy p{margin:0 0 14px;color:var(--silver);font-family:Georgia,"Times New Roman",serif;font-size:18px;line-height:1.75;overflow-wrap:anywhere}.course-passage-copy p:last-child{margin-bottom:0}.course-passage-target{animation:course-target 2.2s ease}.course-passage-target .course-citation{color:#fff}.course-passage-target{background:rgba(110,210,255,.13)}@keyframes course-target{0%,45%{box-shadow:inset 4px 0 #ffe28a}100%{box-shadow:inset 4px 0 transparent}}

.quick-search-icon svg{display:block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
@media(min-width:700px){.quick-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.quick-card{padding:16px}.quick-search-icon svg{width:30px;height:30px}.course-book-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.course-book-grid{grid-template-columns:1fr}.course-reader-bar{grid-template-columns:1fr}.course-reader-bar .daily-step{justify-self:start;min-width:0}.course-passage{display:block;padding:18px 16px}.course-citation{display:block;margin-bottom:8px}.course-passage-copy p{font-size:17px;line-height:1.7}.course-section-list button{grid-template-columns:1fr}.course-search-box{top:79px}}