/* =====================================================================
   Observatorio de Medios (/medios). Usa también analizador.css (puntos,
   etiquetas y resultado del análisis).
   ===================================================================== */
.om-cabecera {
  color: #f4f1f8; padding-block: clamp(1.5rem, 4vw, 2.25rem) clamp(1.75rem, 4.5vw, 2.75rem);
  background:
    radial-gradient(48rem 26rem at 88% 0%, rgba(116, 68, 180, .42), transparent 70%),
    radial-gradient(30rem 20rem at 0% 100%, rgba(242, 165, 65, .14), transparent 70%),
    var(--mr-noche);
}
.om-cabecera .migas { color: #b9b0c8; margin-bottom: clamp(1rem, 3vw, 1.5rem); }
.om-cabecera .migas a { color: #cfc6dd; }
.om-etiqueta { display: flex; align-items: center; gap: .55rem; margin: 0 0 .7rem; font-size: .74rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #ffd59a; }
.om-etiqueta::before { content: ""; width: .5rem; height: .5rem; border-radius: 50%; background: var(--mr-cempa); box-shadow: 0 0 0 4px rgba(242, 165, 65, .22); }
.om-cabecera h1 { color: #fff; font-size: clamp(2rem, 5vw, 3.3rem); line-height: 1.06; letter-spacing: -.03em; margin: 0; overflow-wrap: anywhere; }
.om-cabecera h1 em { font-style: italic; color: #ffd59a; }
.om-intro { margin: 1rem 0 0; max-width: 48rem; color: #cfc6dd; font-size: 1.06rem; line-height: 1.6; }
.om-intro a { color: #ffd59a; }
.om-cab-cifras { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin: 1.25rem 0 0; padding: 0; list-style: none; color: #e6e0ef; font-size: .95rem; }
.om-cab-cifras strong { color: #fff; font-size: 1.15rem; }

.om-nav { background: #fff; border-bottom: 1px solid var(--mr-linea); position: sticky; top: var(--alto-cabecera, 74px); z-index: 20; }
@media (max-width: 767.98px) { .om-nav { position: static; } }
.om-nav-lista { display: flex; gap: .25rem; overflow-x: auto; scrollbar-width: none; padding: .6rem 0; margin: 0; list-style: none; }
.om-nav-lista::-webkit-scrollbar { display: none; }
.om-nav-lista a { display: inline-flex; align-items: center; gap: .45rem; flex: none; padding: .4rem .9rem; border-radius: 999px; font-size: .9rem; font-weight: 600; color: var(--mr-piedra); text-decoration: none; white-space: nowrap; }
.om-nav-lista a:hover { background: var(--mr-papel); color: var(--mr-morado); }
.om-nav-lista a[aria-current="page"] { background: var(--mr-noche); color: #fff; }
.om-nav-lista .om-nav-accion { margin-left: auto; background: var(--mr-morado-claro); color: var(--mr-morado-2); }

/* Cifras ---------------------------------------------------------------- */
.om-cifras { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); gap: 0; margin: 0; background: #fff; border: 1px solid var(--mr-linea); border-radius: var(--mr-radio-lg); overflow: hidden; }
.om-cifras > div { padding: 1.15rem 1.3rem; box-shadow: 1px 0 0 var(--mr-linea), 0 1px 0 var(--mr-linea); display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: .2rem; }
.om-cifras dt { font-size: .86rem; font-weight: 500; color: var(--mr-piedra); line-height: 1.35; }
.om-cifras dd { margin: 0; font-size: clamp(1.6rem, 3.5vw, 2.1rem); font-weight: 750; letter-spacing: -.02em; color: var(--mr-tinta); line-height: 1.1; }
.om-cifras .destacada dd { color: var(--mr-morado); }
.om-cifras .bien dd { color: var(--mr-verde); }
.om-cifras .mal dd { color: var(--mr-rojo); }
.om-cifras small { font-size: .8rem; color: var(--mr-piedra-2); font-weight: 500; }

.om-seccion { scroll-margin-top: calc(var(--alto-cabecera, 72px) + 4rem); }
.om-seccion-cab { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: .75rem 1.5rem; margin-bottom: 1.25rem; }
.om-seccion-cab h2 { margin: 0; }
.om-seccion-cab p { margin: .35rem 0 0; color: var(--mr-piedra); max-width: 46rem; }

/* Gráficas --------------------------------------------------------------- */
.om-graficas { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 24rem), 1fr)); }
.om-grafica { margin: 0; padding: 1.15rem 1.25rem 1rem; background: #fff; border: 1px solid var(--mr-linea); border-radius: var(--mr-radio-lg); min-width: 0; }
.om-grafica.ancha { grid-column: 1 / -1; }
.om-grafica h3 { font-size: 1.02rem; margin: 0 0 .2rem; }
.om-grafica .descripcion { font-size: .86rem; color: var(--mr-piedra); margin: 0 0 .75rem; }
.om-lienzo { position: relative; height: var(--alto, 260px); }
.om-lienzo canvas { width: 100% !important; }
.om-grafica details { margin-top: .6rem; }
.om-grafica summary { cursor: pointer; font-size: .85rem; color: var(--mr-morado); font-weight: 600; }
.om-sin-graficas .om-lienzo { display: none; }
.om-tabla { width: 100%; font-size: .88rem; margin: .5rem 0 0; }
.om-tabla th, .om-tabla td { padding: .35rem .5rem; border-bottom: 1px solid var(--mr-linea); }
.om-tabla .num { text-align: right; font-variant-numeric: tabular-nums; }

/* Barras simples (rasgos y categorías) ---------------------------------- */
.om-barras { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.om-barras li { display: grid; grid-template-columns: minmax(8rem, 13rem) 1fr auto; gap: .75rem; align-items: center; font-size: .9rem; }
.om-barras .pista { height: .65rem; border-radius: 999px; background: var(--mr-papel); overflow: hidden; }
.om-barras .pista > span { display: block; height: 100%; border-radius: 999px; background: var(--c, var(--mr-morado)); }
.om-barras .valor { font-variant-numeric: tabular-nums; font-weight: 650; min-width: 3.5rem; text-align: right; }
.om-barras li.mal { --c: #c2410c; } .om-barras li.bien { --c: #1f7a5a; }
@media (max-width: 575.98px) { .om-barras li { grid-template-columns: 1fr auto; } .om-barras .pista { grid-column: 1 / -1; grid-row: 2; } }

/* Rankings -------------------------------------------------------------- */
.om-rankings { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.om-ranking { background: #fff; border: 1px solid var(--mr-linea); border-radius: var(--mr-radio-lg); padding: 1rem 1.1rem; border-top: 4px solid var(--c, var(--mr-morado)); }
.om-ranking h3 { font-size: 1rem; display: flex; align-items: center; gap: .5rem; margin: 0 0 .25rem; }
.om-ranking h3 i { color: var(--c, var(--mr-morado)); }
.om-ranking > p { font-size: .82rem; color: var(--mr-piedra); margin: 0 0 .6rem; }
.om-ranking ol { margin: 0; padding: 0; list-style: none; display: grid; gap: .35rem; }
.om-ranking li { display: flex; justify-content: space-between; align-items: center; gap: .5rem; font-size: .9rem; }
.om-ranking li a { color: var(--mr-tinta); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.om-ranking li a:hover { color: var(--mr-morado); text-decoration: underline; }
.om-ranking .vacio-mini { font-size: .88rem; color: var(--mr-piedra-2); margin: 0; }
.om-r-aliado { --c: #1f7a5a; } .om-r-respetuoso { --c: #4d7c0f; } .om-r-amarillista { --c: #c2410c; } .om-r-agresivo { --c: #b42318; }

/* Expresiones ----------------------------------------------------------- */
.om-expresiones { display: grid; gap: .6rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); list-style: none; margin: 0; padding: 0; }
.om-expresiones li { background: #fff; border: 1px solid var(--mr-linea); border-radius: var(--mr-radio); padding: .75rem .9rem; display: grid; gap: .25rem; }
.om-expresiones .frase { font-weight: 700; color: var(--mr-rojo); }
.om-expresiones .frase::before { content: "«"; } .om-expresiones .frase::after { content: "»"; }
.om-expresiones .meta { font-size: .8rem; color: var(--mr-piedra); }
.om-expresiones .mejor { font-size: .85rem; color: #1f5f47; }

/* Lista de notas ------------------------------------------------------- */
.om-filtros { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); align-items: end; margin-bottom: 1.25rem; padding: 1rem; background: #fff; border: 1px solid var(--mr-linea); border-radius: var(--mr-radio-lg); }
.om-filtros .om-filtro-q { grid-column: span 2; }
@media (max-width: 575.98px) { .om-filtros .om-filtro-q { grid-column: auto; } }
.om-filtros .form-label { font-size: .82rem; font-weight: 650; margin-bottom: .25rem; }
.om-filtros-botones { display: flex; gap: .5rem; flex-wrap: wrap; }
.om-notas { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; }
.om-nota { display: grid; grid-template-columns: auto 1fr; gap: .9rem; padding: 1rem 1.1rem; background: #fff; border: 1px solid var(--mr-linea); border-radius: var(--mr-radio); min-width: 0; }
.om-nota .az-punto { margin-top: .15rem; }
.om-nota h3 { font-size: 1rem; margin: 0 0 .2rem; line-height: 1.35; overflow-wrap: anywhere; }
.om-nota h3 a { color: var(--mr-tinta); text-decoration: none; }
.om-nota h3 a:hover { color: var(--mr-morado); text-decoration: underline; }
.om-nota .meta { font-size: .85rem; color: var(--mr-piedra); margin: 0; }
.om-nota .meta a { color: inherit; }
.om-insignia { display: inline-flex; align-items: center; gap: .3rem; font-size: .75rem; font-weight: 650; padding: .05rem .5rem; border-radius: 999px; background: var(--mr-ambar-claro); color: var(--mr-ambar); }
.om-insignia.roto { background: #f1eff4; color: #4f4a5c; }
.om-insignia.bien { background: var(--mr-verde-claro); color: var(--mr-verde); }
.om-insignia.mal { background: var(--mr-rojo-claro); color: var(--mr-rojo); }

/* Tabla de medios --------------------------------------------------- */
.om-tabla-medios { width: 100%; background: #fff; border: 1px solid var(--mr-linea); border-radius: var(--mr-radio-lg); overflow: hidden; }
.om-tabla-medios th, .om-tabla-medios td { padding: .6rem .8rem; vertical-align: middle; }
.om-tabla-medios thead th { font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--mr-piedra); background: var(--mr-papel); }
.om-tabla-medios tbody th a { font-weight: 650; color: var(--mr-tinta); text-decoration: none; }
.om-tabla-medios tbody th a:hover { color: var(--mr-morado); text-decoration: underline; }
.om-tabla-medios tbody th small { display: block; font-weight: 400; color: var(--mr-piedra-2); font-size: .78rem; }
.om-tabla-medios .num { text-align: right; font-variant-numeric: tabular-nums; }

/* Página de una nota ---------------------------------------------------- */
.om-nota-pagina { display: grid; gap: 1.5rem; grid-template-columns: minmax(0, 1fr) 20rem; align-items: start; }
@media (max-width: 991.98px) { .om-nota-pagina { grid-template-columns: 1fr; } }
.om-lateral { display: grid; gap: 1rem; }
.om-caja { background: #fff; border: 1px solid var(--mr-linea); border-radius: var(--mr-radio-lg); padding: 1.1rem 1.2rem; }
.om-caja h2 { font-size: 1rem; margin: 0 0 .6rem; }
.om-caja dl { margin: 0; display: grid; gap: .5rem; font-size: .9rem; }
.om-caja dt { color: var(--mr-piedra); font-weight: 500; font-size: .8rem; }
.om-caja dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.om-versiones { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; font-size: .88rem; }
.om-versiones li { display: flex; gap: .5rem; align-items: center; }
.om-copia { margin-top: 1.25rem; }
.om-copia summary { cursor: pointer; color: var(--mr-morado); font-weight: 600; }
.om-copia-cuerpo { margin-top: .75rem; padding: 1rem 1.2rem; background: var(--mr-papel); border-radius: var(--mr-radio); max-height: 30rem; overflow: auto; font-size: .95rem; line-height: 1.65; }

/* Llamado al Analizador ------------------------------------------------- */
.om-cta { display: grid; grid-template-columns: auto 1fr auto; gap: 1rem 1.25rem; align-items: center; padding: 1.25rem 1.5rem; border-radius: var(--mr-radio-lg); background: var(--mr-morado-claro); }
.om-cta > i { font-size: 1.8rem; color: var(--mr-morado); }
.om-cta h2 { font-size: 1.15rem; margin: 0 0 .2rem; }
.om-cta p { margin: 0; color: #4a3d63; }
@media (max-width: 767.98px) { .om-cta { grid-template-columns: 1fr; } .om-cta > i { display: none; } }

.om-metodo h2 { margin-top: 2rem; }
.om-metodo h2:first-child { margin-top: 0; }
.om-metodo { max-width: 52rem; }
.om-aviso-ia { font-size: .88rem; color: var(--mr-piedra); border-left: 3px solid var(--mr-cempa); padding-left: .85rem; }

/* Clases de medios ------------------------------------------------------ */
.om-clase { display: inline-flex; align-items: center; gap: .35rem; font-size: .8rem; font-weight: 650; padding: .15rem .6rem; border-radius: 999px; white-space: nowrap; background: #f1eff4; color: #4f4a5c; }
.om-c-aliado { background: var(--mr-verde-claro); color: var(--mr-verde); }
.om-c-respetuoso { background: #ecf5e4; color: #3f6610; }
.om-c-mejorable { background: var(--mr-ambar-claro); color: var(--mr-ambar); }
.om-c-amarillista { background: #fdeee6; color: #9a3412; }
.om-c-agresivo { background: var(--mr-rojo-claro); color: var(--mr-rojo); }
.om-cabecera .om-clase { vertical-align: middle; margin-right: .35rem; }
.om-leyenda-clases { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); }
.om-leyenda-clases li { display: flex; flex-direction: column; align-items: flex-start; gap: .3rem; padding: .8rem 1rem; background: #fff; border: 1px solid var(--mr-linea); border-radius: var(--mr-radio); font-size: .88rem; color: var(--mr-piedra); }
.om-metodo .az-escala { margin: 1rem 0; }
.om-metodo .accordion-button { font-weight: 600; }