/* Comentarios sin registro (ORDEN-20261023). Solo en las guías que los llevan; usa los tokens del sitio,
   así el modo noche sale solo. */
.comentarios { max-width: 68ch; margin: 40px auto 0; padding-top: 24px; border-top: 1px solid var(--line-2); }
.comentarios[hidden] { display: none; }
.design-reading .comentarios .comentarios-cabeza h2 { margin: 0 0 10px; }
.comentarios-total { color: var(--ink-3); font-weight: 500; font-size: .8em; }
.comentarios-intro { margin: 0 0 18px; color: var(--ink-2); }
.comentarios-lectura:empty, .comentarios-estado:empty { display: none; }
.comentarios-lectura { margin: 0 0 18px; padding: 14px 16px; border-radius: var(--r); background: var(--surface-2); color: var(--ink-2); }
.comentarios-lista { list-style: none; margin: 0 0 18px; padding: 0; }
.comentarios-lista:empty { display: none; }
.design-reading .comentarios-lista > li { margin: 0; padding: 16px 0; border-bottom: 1px solid var(--line); }
.comentarios-lista > li:first-child { padding-top: 4px; }
.comentario-cabeza { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; margin-bottom: 4px; }
.comentario-cabeza strong { overflow-wrap: anywhere; }
.comentario-cabeza time { font-size: var(--fs-small, .875rem); color: var(--ink-3); }
.comentarios-lista p { margin: 0; overflow-wrap: anywhere; white-space: pre-line; }
.comentarios-paginas { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin: 0 0 24px; }
.comentarios-paginas span { color: var(--ink-2); font-size: var(--fs-small, .875rem); }
.comentarios-form { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: clamp(16px, 3vw, 24px); }
.design-reading .comentarios-form h3 { margin: 0 0 14px; }
.comentarios-form input, .comentarios-form textarea { width: 100%; max-width: 100%; box-sizing: border-box; }
.comentarios-form .field { display: block; margin: 0 0 6px; }
.comentarios-form .field-hint { margin: 6px 0 16px; }
.comentarios-envio { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin-top: 10px; }
.comentarios-contador { color: var(--ink-3); font-variant-numeric: tabular-nums; }
.comentarios-captcha:not(:empty) { margin-top: 14px; max-width: 100%; overflow: hidden; }
.comentarios-estado { margin: 14px 0 0; font-weight: 600; }
.design-reading .comentarios-normas { margin: 14px 0 0; font-size: var(--fs-small, .875rem); line-height: 1.6; color: var(--ink-2); }
@media (max-width: 420px) { .comentarios-envio .btn { width: 100%; } }