/* Academia Mística · reproductor. Tokens de tokens.css; respeta modo diurno / nocturno. */

.am-player-body { min-height: 100vh; display: flex; flex-direction: column; }

/* ---------- Cabecera con avance por módulos ---------- */
.am-ph { position: sticky; top: 0; z-index: 40; background: var(--am-night); color: #E4E7F2; border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
.admin-bar .am-ph { top: 32px; }
.am-ph__inner { display: flex; align-items: center; gap: var(--am-space-5); padding: 10px var(--am-gutter); max-width: 1400px; margin: 0 auto; min-height: 68px; }
.am-ph__logo img { width: 36px; height: 36px; }
.am-ph__progress { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 7px; }
.am-ph__labels { display: flex; justify-content: space-between; gap: var(--am-space-4); font-size: var(--am-fs-xs); }
.am-ph__module { color: #A9B1CC; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am-ph__pct { color: #FFFFFF; font-weight: 700; white-space: nowrap; }
.am-ph__segments { display: flex; gap: 4px; }
.am-ph__seg { flex: 1; height: 6px; border-radius: 3px; background: rgba(255, 255, 255, 0.14); overflow: hidden; }
.am-ph__seg > span { display: block; height: 100%; background: linear-gradient(90deg, #C99BE0, var(--am-primary)); border-radius: 3px; transition: width 400ms var(--am-ease); }
.am-ph__seg.is-current { outline: 1px solid rgba(212, 176, 230, 0.6); outline-offset: 1px; }
.am-ph__tools { display: flex; align-items: center; gap: var(--am-space-2); }
.am-ph__back { min-height: 44px; }
.am-ph__route-btn { display: none; }

/* ---------- Disposición ---------- */
.am-pl { flex: 1; display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: var(--am-space-7); max-width: 1400px; width: 100%; margin: 0 auto; padding: 0 var(--am-gutter); }

/* ---------- Ruta lateral ---------- */
.am-route { position: sticky; top: 69px; align-self: start; max-height: calc(100vh - 69px - 76px); overflow-y: auto; padding: var(--am-space-6) var(--am-space-3) var(--am-space-6) 0; border-right: 1px solid var(--am-line); }
.admin-bar .am-route { top: 101px; }
.am-route__title { font-size: var(--am-fs-xs); font-weight: 700; color: var(--am-muted); letter-spacing: 0.08em; text-transform: uppercase; }
.am-route__title--others { margin-top: var(--am-space-7); }
.am-route__count { font-size: var(--am-fs-xs); color: var(--am-muted); margin: 4px 0 var(--am-space-4); }
.am-route__list, .am-route__modules { list-style: none; margin: 0; padding: 0; }
.am-route__item { position: relative; padding-bottom: 4px; }
.am-route__item:not(:last-child)::before { content: ""; position: absolute; left: 25px; top: 42px; bottom: -2px; width: 2px; border-radius: 1px; background: var(--am-line); }
.am-route__item.is-done:not(:last-child)::before { background: var(--am-primary); }
.am-route__link { position: relative; display: flex; gap: var(--am-space-3); align-items: flex-start; padding: 10px 12px; border-radius: 14px; color: var(--am-text-2); text-decoration: none; }
a.am-route__link:hover { background: var(--am-surface-2); text-decoration: none; }
.am-route__item.is-current .am-route__link { background: rgba(155, 78, 170, 0.14); color: var(--am-ink); }
.am-route__mark { flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%; border: 2px solid var(--am-line-strong); background: var(--am-bg); display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; color: var(--am-ink); }
.am-route__item.is-done .am-route__mark { background: var(--am-primary); border-color: var(--am-primary); color: #FFFFFF; }
.am-route__item.is-current .am-route__mark { border-color: #C99BE0; }
.am-route__item.is-locked .am-route__mark { color: var(--am-muted); }
.am-route__item.is-locked .am-route__link { color: var(--am-muted); }
.am-route__text { display: flex; flex-direction: column; gap: 2px; padding-top: 3px; }
.am-route__name { font-size: var(--am-fs-sm); line-height: 1.35; font-weight: 600; }
.am-route__item.is-current .am-route__name { font-weight: 800; }
.am-route__meta { font-size: var(--am-fs-xs); color: var(--am-muted); }
.am-route__modules { margin-top: var(--am-space-3); display: grid; gap: 2px; }
.am-route__modules li { display: flex; justify-content: space-between; gap: var(--am-space-3); padding: 8px 12px; border-radius: 10px; font-size: var(--am-fs-sm); color: var(--am-text-2); }
.am-route__modules li.is-current { background: var(--am-surface-2); color: var(--am-ink); font-weight: 700; }
.am-route__modules a { color: inherit; text-decoration: none; }
.am-route__modules a:hover { color: var(--am-accent); }
.am-route__mpct { color: var(--am-muted); font-size: var(--am-fs-xs); }

/* ---------- Lección ---------- */
.am-lesson { min-width: 0; max-width: 820px; padding: var(--am-space-7) 0 140px; }
.am-lesson__eyebrow { font-size: var(--am-fs-xs); color: var(--am-muted); font-weight: 600; letter-spacing: 0.04em; }
.am-lesson__title { font-size: clamp(2rem, 4vw, 3rem); line-height: 1.08; margin-top: var(--am-space-3); text-wrap: balance; }
.am-lesson__course { margin-top: var(--am-space-3); font-size: var(--am-fs-sm); color: var(--am-muted); }
.am-lesson__course a { color: var(--am-accent); text-decoration: none; }
.am-media { position: relative; margin-top: var(--am-space-6); border-radius: 20px; overflow: hidden; background: #0B1128; border: 1px solid var(--am-line); aspect-ratio: 16 / 9; }
.am-media--pdf { aspect-ratio: 3 / 4; max-height: 80vh; }
.mlms-video__media, .mlms-pdf__media { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.am-media__alt { margin-top: var(--am-space-2); font-size: var(--am-fs-sm); }
.am-lesson__pages { margin-top: var(--am-space-6); }
.am-lesson__page { font-size: 1.125rem; line-height: 1.75; color: var(--am-text-2); }
.am-lesson__page h2, .am-lesson__page h3 { color: var(--am-ink); }
.am-lesson__guest { margin-top: var(--am-space-6); padding: var(--am-space-4) var(--am-space-5); border-radius: var(--am-radius-md); background: var(--am-surface-2); }

.am-resources { margin-top: var(--am-space-7); }
.am-resources h2 { font-size: var(--am-fs-h4); }
.am-resources ul { list-style: none; margin: var(--am-space-3) 0 0; padding: 0; display: grid; gap: var(--am-space-2); }
.am-resources a { display: flex; align-items: center; gap: var(--am-space-3); padding: 14px 16px; border-radius: 14px; border: 1px solid var(--am-line); background: var(--am-surface); color: var(--am-text); text-decoration: none; }
.am-resources a:hover { border-color: var(--am-line-strong); }
.am-resources__ext { font-size: 11px; font-weight: 800; padding: 4px 8px; border-radius: 6px; background: #D4B0E6; color: var(--am-night); }
.am-resources__name { flex: 1; font-weight: 600; }
.am-resources__size { color: var(--am-muted); font-size: var(--am-fs-xs); }

.am-lock { margin-top: var(--am-space-6); padding: var(--am-space-7); border-radius: var(--am-radius-lg); border: 1px dashed var(--am-line-strong); background: var(--am-surface); text-align: center; display: flex; flex-direction: column; align-items: center; gap: var(--am-space-3); }
.am-lock__icon { width: 64px; height: 64px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--am-surface-2); color: var(--am-accent); }
.am-lock h2 { font-size: var(--am-fs-h4); }
.am-lock p { color: var(--am-text-2); max-width: 46ch; }
.am-lock__actions { display: flex; flex-wrap: wrap; gap: var(--am-space-3); justify-content: center; margin-top: var(--am-space-3); }

/* ---------- Barra inferior ---------- */
.am-pbar { position: sticky; bottom: 0; z-index: 40; background: color-mix(in srgb, var(--am-bg) 94%, transparent); backdrop-filter: blur(10px); border-top: 1px solid var(--am-line); }
.am-pbar__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--am-space-4); max-width: 1400px; margin: 0 auto; padding: 12px var(--am-gutter); min-height: 76px; }
.am-pbar__back { display: inline-flex; align-items: center; gap: var(--am-space-2); min-height: 48px; padding: 0 var(--am-space-5); border-radius: 14px; border: 1px solid var(--am-line-strong); background: transparent; color: var(--am-text); font: inherit; font-weight: 700; cursor: pointer; }
.am-pbar__back .am-icon { transform: rotate(180deg); }
.am-pbar__back:hover:not([disabled]) { border-color: var(--am-text-2); }
.am-pbar__back[disabled] { opacity: 0.35; cursor: default; }
.am-pbar__mid { display: flex; align-items: center; gap: var(--am-space-4); min-width: 0; }
.am-pbar__dots { display: flex; gap: 6px; }
.am-pbar__dot { width: 8px; height: 8px; border-radius: 4px; background: var(--am-line-strong); transition: width var(--am-dur) var(--am-ease), background-color var(--am-dur) var(--am-ease); }
.am-pbar__dot.is-on { background: var(--am-primary); }
.am-pbar__dot.is-current { width: 22px; }
.am-pbar__status { font-size: var(--am-fs-xs); color: var(--am-muted); letter-spacing: 0.04em; white-space: nowrap; }
.am-pbar__next { border-radius: 14px; min-height: 48px; }
.am-pbar__next.is-complete { background: var(--am-success); }
[data-am-theme="dark"] .am-pbar__next.is-complete { background: #2E8B7A; }
.am-pbar__next[disabled] { opacity: 0.4; }

/* ---------- Móvil ---------- */
@media (max-width: 980px) {
	.am-pl { grid-template-columns: minmax(0, 1fr); }
	.am-ph__route-btn { display: inline-flex; }
	.am-ph__back { display: none; }
	.am-route {
		position: fixed; inset: 69px 0 76px 0; z-index: 35; max-height: none; border-right: 0; align-self: stretch;
		background: var(--am-bg); padding: var(--am-space-5) var(--am-gutter);
		visibility: hidden; opacity: 0; transform: translateX(-12px);
		transition: opacity var(--am-dur) var(--am-ease), transform var(--am-dur) var(--am-ease), visibility 0s linear var(--am-dur);
	}
	.am-route.is-open { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
	.am-lesson { padding-top: var(--am-space-5); }
}
@media (max-width: 560px) {
	.am-ph__labels .am-ph__module { max-width: 60vw; }
	.am-pbar__status { display: none; }
	.am-pbar__back span { display: none; }
	.am-pbar__back { padding: 0 var(--am-space-4); }
}

/* ---------- Quiz y tarea ---------- */
.am-assess { margin-top: var(--am-space-7); padding: var(--am-space-6); border-radius: var(--am-radius-lg); border: 1px solid var(--am-line); background: var(--am-surface); scroll-margin-top: 90px; }
.am-assess[hidden] { display: none; }
.am-assess__head { display: flex; align-items: center; gap: var(--am-space-4); }
.am-assess__icon { width: 48px; height: 48px; border-radius: 14px; display: flex; align-items: center; justify-content: center; background: rgba(155, 78, 170, 0.14); color: var(--am-accent); flex-shrink: 0; }
.am-assess--task .am-assess__icon { background: rgba(25, 49, 100, 0.10); color: var(--am-blue); }
[data-am-theme="dark"] .am-assess--task .am-assess__icon { background: rgba(255, 255, 255, 0.08); color: #B8C6EE; }
.am-assess__kicker { font-size: var(--am-fs-xs); font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--am-muted); }
.am-assess__title { font-size: var(--am-fs-h4); margin-top: 2px; }
.am-assess__facts { list-style: none; margin: var(--am-space-4) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--am-space-2); }
.am-assess__facts li { font-size: var(--am-fs-xs); font-weight: 600; padding: 6px 12px; border-radius: var(--am-radius-pill); background: var(--am-bg); border: 1px solid var(--am-line); color: var(--am-text-2); }
.am-assess__body { margin-top: var(--am-space-5); }
.am-assess__lead { color: var(--am-text-2); }
.am-assess__actions { margin-top: var(--am-space-5); display: flex; flex-wrap: wrap; gap: var(--am-space-3); }
.am-assess__go { min-height: 52px; border-radius: 14px; }
.am-assess__go[disabled] { opacity: 0.6; cursor: progress; }
.am-assess__sub { font-size: var(--am-fs-lg); margin-top: var(--am-space-6); }
.am-assess__notice { padding: 12px 16px; border-radius: 12px; background: var(--am-bg); border: 1px solid var(--am-line); color: var(--am-text-2); margin-top: var(--am-space-3); }
.am-assess__notice.is-error { border-color: color-mix(in srgb, var(--am-error) 45%, transparent); color: var(--am-error); }
.am-assess__notice.is-warning { border-color: color-mix(in srgb, var(--am-warning) 45%, transparent); color: var(--am-warning); }

.am-quizbar { position: sticky; top: 80px; z-index: 5; display: flex; align-items: center; gap: var(--am-space-4); padding: 10px 16px; border-radius: 14px; background: var(--am-bg); border: 1px solid var(--am-line); font-size: var(--am-fs-sm); }
.am-quizbar__count { font-weight: 700; color: var(--am-ink); }
.am-quizbar__saved { color: var(--am-muted); font-size: var(--am-fs-xs); }
.am-quizbar__time { margin-left: auto; font-variant-numeric: tabular-nums; font-weight: 800; font-size: var(--am-fs-lg); color: var(--am-ink); }
.am-quizbar__time.is-low { color: var(--am-error); }

.am-quiz { display: grid; gap: var(--am-space-4); margin-top: var(--am-space-4); }
.am-q { margin: 0; padding: var(--am-space-5); border: 1px solid var(--am-line); border-radius: var(--am-radius-md); background: var(--am-bg); min-width: 0; transition: border-color var(--am-dur) var(--am-ease); }
.am-q.is-answered { border-color: color-mix(in srgb, var(--am-primary) 45%, var(--am-line)); }
.am-q__legend { display: flex; justify-content: space-between; gap: var(--am-space-3); width: 100%; float: left; font-size: var(--am-fs-xs); font-weight: 700; color: var(--am-muted); letter-spacing: 0.04em; text-transform: uppercase; }
.am-q__legend + * { clear: both; }
.am-q__text { padding-top: var(--am-space-3); font-size: var(--am-fs-lg); line-height: 1.5; color: var(--am-ink); font-weight: 600; }
.am-q__img { display: block; max-width: 100%; max-height: 360px; border-radius: 12px; margin-top: var(--am-space-3); }
.am-q__hint { font-size: var(--am-fs-xs); color: var(--am-muted); margin-top: var(--am-space-2); }
.am-q__opts { display: grid; gap: var(--am-space-2); margin-top: var(--am-space-3); }
.am-q__opts--tf { grid-template-columns: 1fr 1fr; }
.am-opt { position: relative; display: flex; align-items: center; gap: var(--am-space-3); min-height: 52px; padding: 12px 16px; border: 1px solid var(--am-line-strong); border-radius: 14px; cursor: pointer; transition: border-color var(--am-dur) var(--am-ease), background-color var(--am-dur) var(--am-ease); }
.am-opt:hover { border-color: var(--am-text-2); }
.am-opt input { position: absolute; opacity: 0; pointer-events: none; }
.am-opt__mark { flex-shrink: 0; width: 22px; height: 22px; border: 2px solid var(--am-line-strong); border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.am-opt input[type="checkbox"] + .am-opt__mark { border-radius: 6px; }
.am-opt:has(input:checked) { border-color: var(--am-primary); background: rgba(155, 78, 170, 0.08); }
.am-opt input:checked + .am-opt__mark { border-color: var(--am-primary); background: var(--am-primary); box-shadow: inset 0 0 0 3px var(--am-bg); }
.am-opt input[type="checkbox"]:checked + .am-opt__mark { box-shadow: none; background: var(--am-primary) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 14px no-repeat; }
.am-opt input:focus-visible + .am-opt__mark { outline: 2px solid var(--am-focus); outline-offset: 3px; }
.am-opt__text { color: var(--am-text); line-height: 1.4; }
.am-q__fill { margin-top: var(--am-space-3); font-size: var(--am-fs-lg); line-height: 2.2; color: var(--am-ink); }
.am-blank { width: 9em; max-width: 100%; margin: 0 4px; padding: 4px 10px; border: 0; border-bottom: 2px solid var(--am-primary); border-radius: 8px 8px 0 0; background: var(--am-surface-2); color: var(--am-ink); font: inherit; font-size: var(--am-fs-base); }
.am-blank:focus { outline: 2px solid var(--am-focus); outline-offset: 2px; }
.am-q__open { width: 100%; margin-top: var(--am-space-3); padding: 14px 16px; border: 1px solid var(--am-line-strong); border-radius: 14px; background: var(--am-bg); color: var(--am-ink); font: inherit; line-height: 1.6; resize: vertical; }
.am-q__open:focus { outline: 2px solid var(--am-focus); outline-offset: 1px; border-color: transparent; }

.am-result { display: flex; align-items: center; gap: var(--am-space-5); padding: var(--am-space-5); border-radius: var(--am-radius-md); background: var(--am-bg); border: 1px solid var(--am-line); }
.am-result.is-passed, .am-result.is-approved { border-color: color-mix(in srgb, var(--am-success) 50%, var(--am-line)); }
.am-result.is-failed, .am-result.is-rejected { border-color: color-mix(in srgb, var(--am-warning) 50%, var(--am-line)); }
.am-result__title { font-size: var(--am-fs-h4); font-weight: 800; color: var(--am-ink); }
.am-result__text p + p { margin-top: 4px; color: var(--am-text-2); }
.am-result__pending { flex-shrink: 0; width: 72px; height: 72px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 28px; font-weight: 800; background: var(--am-surface-2); color: var(--am-accent); }
.am-result.is-approved .am-result__pending { background: color-mix(in srgb, var(--am-success) 18%, transparent); color: var(--am-success); }
.am-result.is-rejected .am-result__pending { background: color-mix(in srgb, var(--am-warning) 18%, transparent); color: var(--am-warning); }
.am-ring { position: relative; flex-shrink: 0; width: 88px; height: 88px; }
.am-ring svg { display: block; }
.am-ring strong { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: var(--am-fs-lg); color: var(--am-ink); }
.am-ring__track { fill: none; stroke: var(--am-line); stroke-width: 8; }
.am-ring__bar { fill: none; stroke: var(--am-warning); stroke-width: 8; stroke-linecap: round; }
.am-ring.is-ok .am-ring__bar { stroke: var(--am-success); }

.am-review { list-style: none; margin: var(--am-space-3) 0 0; padding: 0; display: grid; gap: var(--am-space-3); }
.am-review__item { padding: var(--am-space-4) var(--am-space-5); border-radius: var(--am-radius-md); background: var(--am-bg); border: 1px solid var(--am-line); border-left: 4px solid var(--am-line-strong); }
.am-review__item.is-correct { border-left-color: var(--am-success); }
.am-review__item.is-wrong { border-left-color: var(--am-error); }
.am-review__item.is-partial { border-left-color: var(--am-warning); }
.am-review__head { display: flex; justify-content: space-between; gap: var(--am-space-3); font-size: var(--am-fs-xs); font-weight: 700; }
.am-review__item.is-correct .am-review__badge { color: var(--am-success); }
.am-review__item.is-wrong .am-review__badge { color: var(--am-error); }
.am-review__item.is-partial .am-review__badge { color: var(--am-warning); }
.am-review__pts { color: var(--am-muted); }
.am-review__q { margin-top: var(--am-space-2); font-weight: 600; color: var(--am-ink); }
.am-review__img { max-width: 220px; border-radius: 10px; margin-top: var(--am-space-2); }
.am-review__line { margin-top: var(--am-space-2); font-size: var(--am-fs-sm); color: var(--am-text-2); }
.am-review__line.is-solution strong { color: var(--am-success); }
.am-review__expl { margin-top: var(--am-space-2); font-size: var(--am-fs-sm); color: var(--am-muted); }
.am-review__fb { margin: var(--am-space-4) 0 0; padding: 12px 16px; border-left: 3px solid var(--am-primary); background: var(--am-surface-2); border-radius: 0 12px 12px 0; color: var(--am-text); white-space: pre-line; }

.am-task { display: grid; gap: var(--am-space-2); margin-top: var(--am-space-4); }
.am-task__label { font-weight: 700; color: var(--am-ink); margin-top: var(--am-space-3); }
.am-drop { display: flex; flex-wrap: wrap; align-items: center; gap: var(--am-space-3); padding: var(--am-space-5); border: 2px dashed var(--am-line-strong); border-radius: var(--am-radius-md); background: var(--am-bg); }
.am-drop.is-over { border-color: var(--am-primary); background: rgba(155, 78, 170, 0.06); }
.am-drop__hint { color: var(--am-muted); font-size: var(--am-fs-sm); }
.am-task__files, .am-sub__files { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--am-space-2); }
.am-task__files li, .am-sub__files li { display: flex; align-items: center; gap: var(--am-space-3); padding: 10px 14px; border-radius: 12px; background: var(--am-bg); border: 1px solid var(--am-line); font-size: var(--am-fs-sm); }
.am-task__fname { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.am-task__fsize, .am-sub__files span { color: var(--am-muted); font-size: var(--am-fs-xs); }
.am-task__rm { border: 0; background: none; color: var(--am-error); font: inherit; font-weight: 700; cursor: pointer; padding: 6px; }
.am-sub__text { padding: 14px 16px; border-radius: 12px; background: var(--am-bg); border: 1px solid var(--am-line); white-space: pre-line; color: var(--am-text-2); margin-top: var(--am-space-3); }
.am-sub__files { margin-top: var(--am-space-3); }
.am-sub__files a { color: var(--am-accent); font-weight: 600; }

@media (max-width: 560px) {
	.am-assess { padding: var(--am-space-5) var(--am-space-4); margin-left: calc(-1 * var(--am-space-2)); margin-right: calc(-1 * var(--am-space-2)); }
	.am-q { padding: var(--am-space-4); }
	.am-q__opts--tf { grid-template-columns: 1fr; }
	.am-result { flex-direction: column; align-items: flex-start; }
	.am-quizbar { top: 72px; }
}