/* «¿Es correcto este análisis?» (8 nov 2026): la caja en /medios/nota, la ventana de la computadora y la página
   del celular. Azul de Turing; no depende de nota.css. */
.ot-caja, .ot-ventana, .ot-pagina {
    --ot-azul: #1d4ed8; --ot-azul-2: #1e40af; --ot-claro: #e8effd; --ot-hielo: #f4f7fe; --ot-linea: #d6e0f2;
    --ot-tinta: #0f1a30; --ot-piedra: #56617a; --ot-ambar: #8a5a00; --ot-ambar-fondo: #fff6df; --ot-verde: #0f6b3e; --ot-verde-fondo: #e7f6ee;
    --ot-mal: #a4231a; --ot-mal-fondo: #fdecea;
}
.ot-caja .btn-primary, .ot-ventana .btn-primary, .ot-pagina .btn-primary { --bs-btn-bg: var(--ot-azul); --bs-btn-border-color: var(--ot-azul); --bs-btn-hover-bg: var(--ot-azul-2); --bs-btn-hover-border-color: var(--ot-azul-2); --bs-btn-active-bg: var(--ot-azul-2); --bs-btn-disabled-bg: var(--ot-azul); --bs-btn-disabled-border-color: var(--ot-azul); }
.ot-caja .btn-outline-primary, .ot-ventana .btn-outline-primary, .ot-pagina .btn-outline-primary { --bs-btn-color: var(--ot-azul); --bs-btn-border-color: var(--ot-azul); --bs-btn-hover-bg: var(--ot-azul); --bs-btn-hover-border-color: var(--ot-azul); --bs-btn-active-bg: var(--ot-azul-2); }

/* La caja en la nota */
.ot-caja { margin: 1rem 0 1.25rem; display: grid; gap: .65rem; }
.ot-pregunta {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .35rem 1rem;
    background: var(--ot-hielo); border: 1px solid var(--ot-linea); border-left: 4px solid var(--ot-azul);
    border-radius: 14px; padding: .9rem 1.1rem;
}
.ot-pregunta-t { margin: 0; font-weight: 700; color: var(--ot-tinta); display: flex; align-items: center; gap: .45rem; font-size: 1.02rem; }
.ot-logo { flex: none; }
.ot-pregunta-sub { margin: 0; color: var(--ot-piedra); font-size: .9rem; grid-column: 1; }
.ot-botones { grid-column: 2; grid-row: 1 / span 2; display: flex; flex-wrap: wrap; gap: .5rem; justify-content: flex-end; }
.ot-botones form { margin: 0; }
.ot-gracias { grid-column: 1 / -1; margin: .25rem 0 0; color: var(--ot-verde); font-weight: 600; }
.ot-nota-sesion { grid-column: 1 / -1; margin: .2rem 0 0; font-size: .85rem; color: var(--ot-piedra); }
.ot-aviso-revision { display: flex; gap: .6rem; align-items: flex-start; margin: 0; padding: .7rem .95rem; border-radius: 12px; background: var(--ot-ambar-fondo); color: #4a3200; border: 1px solid #f1d58a; font-size: .92rem; line-height: 1.45; }
.ot-aviso-revision > i { color: var(--ot-ambar); margin-top: .2rem; }
.ot-aviso-revision.ot-aprobada { background: var(--ot-verde-fondo); color: #0b3d24; border-color: #b9e3cb; }
.ot-aviso-revision.ot-aprobada > i { color: var(--ot-verde); }
@media (max-width: 575.98px) {
    .ot-pregunta { grid-template-columns: 1fr; }
    .ot-botones { grid-column: 1; grid-row: auto; justify-content: stretch; }
    .ot-botones > *, .ot-botones .btn { flex: 1 1 auto; width: 100%; }
}

/* La ventana (computadora) */
.ot-ventana {
    width: min(46rem, calc(100vw - 2rem)); max-height: min(90vh, 56rem); padding: 0; border: 0; border-radius: 18px;
    box-shadow: 0 24px 64px -12px rgba(7, 20, 48, .45); color: var(--ot-tinta); overflow: hidden;
}
.ot-ventana[open] { display: flex; flex-direction: column; }
.ot-ventana::backdrop { background: rgba(7, 20, 48, .55); backdrop-filter: blur(2px); }
.ot-ventana-barra { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .85rem 1.1rem; background: #0a1b3f; color: #fff; }
.ot-ventana-barra p { margin: 0; font-weight: 700; display: flex; gap: .5rem; align-items: center; }
.ot-ventana-barra i { color: #8fd3ff; }
.ot-cerrar { border: 0; background: transparent; color: #fff; font-size: 1.15rem; width: 2.25rem; height: 2.25rem; border-radius: 50%; }
.ot-cerrar:hover, .ot-cerrar:focus-visible { background: rgba(255, 255, 255, .14); }
.ot-cerrar[hidden] { display: none; }
.ot-ventana-botones { display: flex; align-items: center; gap: .15rem; flex: none; }
.ot-min-btn i { transform: translateY(-.2rem); }
.ot-estado-min { font-size: .75rem; font-weight: 600; padding: .1rem .55rem; border-radius: 999px; background: rgba(255, 255, 255, .16); color: #fff; white-space: nowrap; }
.ot-estado-min.cola { background: #fff6df; color: #4a3200; }
.ot-estado-min.listo { background: #e7f6ee; color: #0b3d24; }
.ot-ventana-barra p .ot-estado-min { display: none; }
.ot-releer { display: flex; gap: .45rem; align-items: baseline; font-size: .88rem !important; padding: .45rem .7rem; border-radius: 10px; background: var(--ot-hielo); border: 1px dashed var(--ot-linea); }
.ot-releer i { color: var(--ot-azul); }
.ot-releer a { color: var(--ot-azul); font-weight: 600; }

/* Minimizada (9 nov 2026): una barra abajo a la derecha, sin oscurecer la nota; lo escrito se queda. */
.ot-ventana.ot-min {
    position: fixed; inset: auto 1rem 1rem auto; margin: 0; z-index: 1085;
    width: min(23rem, calc(100vw - 2rem)); max-height: none; border-radius: 14px;
    box-shadow: 0 12px 32px -8px rgba(7, 20, 48, .5);
}
.ot-ventana.ot-min .ot-ventana-cuerpo { display: none; }
.ot-ventana.ot-min .ot-ventana-barra { cursor: pointer; padding: .6rem .7rem .6rem 1rem; }
.ot-ventana.ot-min .ot-ventana-barra p { font-size: .92rem; min-width: 0; }
.ot-ventana.ot-min .ot-ventana-barra p > span:first-of-type { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ot-ventana.ot-min .ot-ventana-barra p .ot-estado-min:not([hidden]) { display: inline-block; }
.ot-ventana-cuerpo { overflow-y: auto; padding: 1.1rem 1.25rem 1.3rem; overscroll-behavior: contain; }
.ot-cargando { color: var(--ot-piedra); margin: 1.5rem 0; text-align: center; }

/* La página propia (celular) */
.ot-pagina { padding-top: 1.25rem; }
.ot-pagina-ancho { max-width: 46rem; }
.ot-volver { margin: 0 0 .75rem; font-size: .92rem; }
.ot-volver a { color: var(--ot-azul); text-decoration: none; }
.ot-pagina-ante { margin: 0; color: var(--ot-azul); font-weight: 700; font-size: .85rem; text-transform: uppercase; letter-spacing: .04em; }
.ot-pagina-h { font-size: clamp(1.25rem, 4.5vw, 1.7rem); margin: .25rem 0 .2rem; }
.ot-pagina-medio { color: var(--ot-piedra); margin: 0 0 1rem; }
.ot-pagina-caja { background: #fff; border: 1px solid var(--ot-linea); border-radius: 16px; padding: clamp(1rem, 4vw, 1.5rem); }

/* Las preguntas */
.ot-h { font-size: 1.15rem; margin: 0 0 .5rem; }
.ot-intro p { margin: 0 0 .6rem; color: var(--ot-piedra); font-size: .94rem; }
.ot-fia { display: inline-flex; gap: .4rem; align-items: center; padding: .3rem .65rem; border-radius: 999px; background: var(--ot-claro); color: var(--ot-azul-2) !important; font-size: .85rem !important; }
.ot-fia-alta { background: var(--ot-verde-fondo); color: var(--ot-verde) !important; }
.ot-fia-baja { background: var(--ot-ambar-fondo); color: var(--ot-ambar) !important; }
.ot-paso { border: 0; margin: 0 0 1.1rem; padding: 0; min-width: 0; }
.ot-legend { font-size: 1rem; font-weight: 700; margin: 0 0 .5rem; float: none; width: auto; padding: 0; display: block; }
.ot-opcional { font-weight: 400; color: var(--ot-piedra); font-size: .85rem; }
.ot-ayuda { margin: -.2rem 0 .55rem; color: var(--ot-piedra); font-size: .86rem; }
.ot-label { display: block; font-size: .9rem; margin: .35rem 0 .25rem; color: var(--ot-piedra); }
.ot-opciones { display: flex; flex-wrap: wrap; gap: .4rem; }
.ot-op { position: relative; cursor: pointer; margin: 0; }
.ot-op input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.ot-op span { display: inline-flex; align-items: center; gap: .35rem; padding: .42rem .75rem; border: 1px solid var(--ot-linea); border-radius: 999px; background: #fff; font-size: .9rem; color: var(--ot-tinta); transition: background .15s, border-color .15s; }
.ot-op:hover span { border-color: var(--ot-azul); }
.ot-op input:checked + span { background: var(--ot-azul); border-color: var(--ot-azul); color: #fff; }
.ot-op input:focus-visible + span { outline: 3px solid #8fb3ff; outline-offset: 2px; }
.ot-op-bien input:checked + span { background: var(--ot-claro); color: var(--ot-azul-2); border-color: var(--ot-azul); }
.ot-si-no .ot-op span { padding: .55rem 1rem; font-weight: 600; }
.ot-frase { border: 1px solid var(--ot-linea); border-radius: 12px; padding: .75rem .85rem; margin-bottom: .6rem; background: var(--ot-hielo); }
.ot-frase.bloqueada { opacity: .8; }
.ot-frag { margin: 0 0 .35rem; font-size: .95rem; line-height: 1.5; }
.ot-frag mark { background: #ffe08a; padding: 0 .15rem; border-radius: 3px; font-weight: 600; }
.ot-turing-dijo { margin: 0 0 .5rem; font-size: .86rem; color: var(--ot-piedra); }
.ot-cat { display: inline-block; font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; background: #fff; border: 1px solid var(--ot-linea); border-radius: 999px; padding: 0 .45rem; margin-right: .35rem; color: var(--ot-tinta); }
.ot-falta { display: grid; grid-template-columns: minmax(0, 1fr) minmax(9rem, 13rem); gap: .4rem; margin-bottom: .45rem; }
@media (max-width: 575.98px) { .ot-falta { grid-template-columns: 1fr; } }
.ot-agregar { padding-left: 0; color: var(--ot-azul); }
.ot-enviar { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; margin-top: .25rem; }
.ot-mis { font-size: .9rem; color: var(--ot-azul); }
.ot-resultado { margin-top: .5rem; border-radius: 12px; padding: .85rem 1rem; background: var(--ot-claro); color: var(--ot-tinta); }
.ot-resultado.listo { background: var(--ot-verde-fondo); }
.ot-resultado.cola { background: var(--ot-ambar-fondo); color: #4a3200; border: 1px solid #f1d58a; }
.ot-resultado.cola .ot-resultado-t > i { color: var(--ot-ambar); }
.ot-resultado-acciones { display: flex; flex-wrap: wrap; gap: .5rem; margin: .35rem 0 0; }
.ot-resultado.mal { background: var(--ot-mal-fondo); color: var(--ot-mal); }
.ot-resultado-t { margin: 0 0 .4rem; font-weight: 600; }
.ot-resultado-motivo { margin: 0 0 .35rem; font-size: .9rem; color: var(--ot-piedra); font-style: italic; }
.ot-resultado-fia { margin: 0 0 .5rem; font-size: .88rem; }
.ot-resultado .btn { margin-top: .25rem; }
.ot-estado { text-align: center; padding: .5rem 0 .25rem; }
.ot-estado p { color: var(--ot-piedra); }
.ot-estado-icono { font-size: 2rem; color: var(--ot-azul); margin-bottom: .5rem; }

/* Mis correcciones y Panel */
.ot-lista { list-style: none; padding: 0; margin: 0; display: grid; gap: .6rem; }
.ot-lista li { border: 1px solid var(--ot-linea); border-radius: 12px; padding: .75rem .9rem; background: #fff; }
.ot-chip { display: inline-flex; align-items: center; gap: .3rem; font-size: .78rem; font-weight: 600; padding: .1rem .55rem; border-radius: 999px; background: var(--ot-claro); color: var(--ot-azul-2); }
.ot-chip.aprobada, .ot-chip.confirmada { background: var(--ot-verde-fondo); color: var(--ot-verde); }
.ot-chip.dudas, .ot-chip.revision { background: var(--ot-ambar-fondo); color: var(--ot-ambar); }
.ot-chip.descartada { background: #eef0f4; color: #5b6475; }