/* ══════════════════════════════════════════════════════════════════════════
   estilo-12.css · RONDA 2.1 DEL ESTANDAR DE RECEPCION v2
   Encargo 784 · corrida 461 · 30-sep-2026

   DOS COSAS, Y LAS DOS SON DE ESTA RONDA:

   1 · LO QUE TRAIA EL 760. Las reglas del calendario, el corte y la ayuda que
       la corrida 447 escribio al FINAL de estilo-10.css en la rama
       code/760-447-calendario-caja-ayuda. Aqui NO pueden ir al final de esa
       hoja: en esta rama estilo-10.css ya va en 48,306 bytes y el tope por
       pieza son 60 KB, asi que 14,720 bytes mas la reventarian. Van en hoja
       propia, DESPUES de estilo-11, y el cuerpo es el mismo byte por byte.

   2 · LOS CINCO TAMANOS EN LAS PANTALLAS QUE NO SE REESCRIBIERON (punto 6 del
       encargo). Hoy, Calendario, Corte y Ayuda ya se pintan con el sistema de
       diseno. Cuartos no: se sigue pintando con las clases viejas
       (.kpi, .cuarto, .hint), que traen 10.5, 11, 11.5, 13, 21 y 27 px y peso
       700. Eso son seis tamanos fuera de los cinco Y un peso fuera de los dos,
       MEDIDO en la vista previa 367 a 1440, 834 y 390 antes de tocar nada.

   POR QUE AQUI Y NO REESCRIBIENDO LA PANTALLA: el punto 6 pide los cinco
   tamanos, no una pantalla nueva. .kpi y .cuarto son componentes COMPARTIDOS
   por media operacion; reescribir vCuartos entera para cambiarle la letra
   seria rehacer lo que funciona y dejar sin arreglar las demas pantallas que
   usan los mismos componentes. Una regla que cuelga de los mismos tokens los
   corrige a todos a la vez.

   Y POR QUE TODO VA COLGADO DE body.ohm-opera: esa clase la prende
   ohmPintaBarra() (app-51) solo dentro del marco de operacion. Fuera de ahi
   —el cuestionario, los sitios publicos, la entrada— no cambia un pixel.
   Ni un color propio y ni un tamano escrito a mano: todo es var() sobre los
   tokens de estilo-10, para que los cinco temas sigan mandando.
   ══════════════════════════════════════════════════════════════════════════ */


/* ══════════════════════════════════════════════════════════════════════════
   RONDA 2 DEL ESTANDAR DE RECEPCION v2 · encargo 760 · corrida 447
   El calendario, la caja y la ayuda. Mismas reglas que la ronda 1: ni un color
   propio, ni un tamaño fuera de los cinco, ni un espaciado que no sea múltiplo
   de 4. Todo cuelga de los tokens de arriba, así que los cinco temas siguen
   mandando.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── EL CALENDARIO ──────────────────────────────────────────────────────────
   La rejilla es la protagonista: ocupa el ancho y se desplaza sola, con el
   encabezado de fechas fijo arriba y la columna de habitaciones fija a la
   izquierda. Las celdas NO llevan borde duro: se separan con un hueco de 2 px
   sobre el fondo de la página, que es lo que deja leer las barras. */
.ohkbar2{display:flex;flex-wrap:wrap;gap:var(--o-e3);align-items:center;
  margin:0 0 var(--o-e4)}
.ohkbar2 .ohkder{margin-left:auto;display:flex;gap:var(--o-e2);align-items:center}
.ohkseg{display:inline-flex;background:var(--o-super);border:1px solid var(--o-linea-f);
  border-radius:var(--o-radio-ctl);overflow:hidden}
.ohkseg button{font:inherit;font-size:var(--o-cuerpo);font-weight:var(--o-fuerte);
  color:var(--o-texto2);background:none;border:0;border-right:1px solid var(--o-linea);
  padding:0 var(--o-e3);min-height:44px;min-width:44px;cursor:pointer;
  transition:background var(--o-mov) var(--o-curva),color var(--o-mov) var(--o-curva)}
.ohkseg button:last-child{border-right:0}
.ohkseg button:hover{background:var(--o-fondo)}
.ohkseg button.on{background:var(--o-acento);color:#fff}
.ohkmes{font:inherit;font-size:var(--o-cuerpo);color:var(--o-texto);
  background:var(--o-super);border:1px solid var(--o-linea-f);
  border-radius:var(--o-radio-ctl);padding:0 var(--o-e3);min-height:44px}

/* La leyenda: fila de pastillas arriba, y cada una filtra. */
.ohkleg{display:flex;flex-wrap:wrap;gap:var(--o-e2);margin:0 0 var(--o-e3)}
.ohkleg button{font:inherit;font-size:var(--o-nota);font-weight:var(--o-fuerte);
  color:var(--o-texto2);background:var(--o-super);border:1px solid var(--o-linea-f);
  border-radius:999px;padding:0 var(--o-e3);min-height:44px;cursor:pointer;
  display:inline-flex;align-items:center;gap:var(--o-e2);
  transition:border-color var(--o-mov) var(--o-curva),color var(--o-mov) var(--o-curva)}
.ohkleg button:hover{border-color:var(--o-texto3)}
.ohkleg button.on{border-color:var(--o-acento);color:var(--o-acento-t)}
.ohkleg i{width:12px;height:12px;border-radius:4px;display:inline-block;flex:0 0 auto}

/* La rejilla y su bandeja. En la computadora del mostrador van lado a lado. */
.ohkwrap{display:grid;gap:var(--o-e4);align-items:start}
@media(min-width:1180px){.ohkwrap.conban{grid-template-columns:minmax(0,1fr) 264px}}

.ohksc{overflow:auto;max-height:72vh;background:var(--o-fondo);
  border:1px solid var(--o-linea);border-radius:var(--o-radio);
  -webkit-overflow-scrolling:touch}
.ohkg{display:grid;gap:2px;padding:2px;
  grid-template-columns:var(--ohk-lab) repeat(var(--ohk-n),var(--ohk-d));
  min-width:max-content;font-variant-numeric:tabular-nums}

/* Encabezado de fechas, fijo al desplazar. */
.ohkg .ohkd{position:sticky;top:0;z-index:3;background:var(--o-super);
  border-radius:var(--o-radio-ctl);padding:var(--o-e2) 0;text-align:center;
  font-size:var(--o-nota);color:var(--o-texto3);line-height:1.25}
.ohkg .ohkd b{display:block;font-size:var(--o-cuerpo-f);font-weight:var(--o-fuerte);
  color:var(--o-texto)}
.ohkg .ohkd.fs{background:var(--o-fondo)}
.ohkg .ohkd.hoy{background:var(--o-acento-suave)}
/* RONDA 3 · el numero de HOY sobre su propio tinte daba 3.6:1. Es la columna
   que dice que dia es hoy en el calendario: la que mas se mira. */
.ohkg .ohkd.hoy b{color:var(--o-acento-t)}
.ohkg .ohkesq{position:sticky;top:0;left:0;z-index:5;background:var(--o-super);
  border-radius:var(--o-radio-ctl);display:flex;align-items:center;
  padding:0 var(--o-e3);font-size:var(--o-nota);font-weight:var(--o-fuerte);
  color:var(--o-texto3)}

/* Columna de habitaciones, fija a la izquierda. */
.ohkg .ohkl{position:sticky;left:0;z-index:2;background:var(--o-super);
  border-radius:var(--o-radio-ctl);display:flex;align-items:center;gap:var(--o-e2);
  padding:0 var(--o-e3);min-height:44px}
.ohkg .ohkl b{font-size:var(--o-cuerpo-f);font-weight:var(--o-fuerte);color:var(--o-texto)}
.ohkl svg{flex:0 0 auto;color:var(--o-texto3)}
/* En el telefono la columna mide 104 px y el nombre del tipo se quedaba en
   una letra y unos puntos, que no dice nada y ocupa lo que necesita el numero
   del cuarto. Se quita: el titulo del grupo, dos renglones arriba, ya nombra
   el tipo completo. */

/* El título de grupo y el renglón A la venta. */
.ohkg .ohkgt{grid-column:1/-1;position:sticky;left:0;width:max-content;
  font-size:var(--o-nota);font-weight:var(--o-fuerte);color:var(--o-texto3);
  padding:var(--o-e3) var(--o-e3) var(--o-e1)}
.ohkg .ohkc{display:flex;align-items:center;justify-content:center;
  border-radius:var(--o-radio-ctl);background:var(--o-super);
  font-size:var(--o-cuerpo);color:var(--o-texto2);min-height:32px}
/* RONDA 3 · EL AMBAR DE «QUEDA UNO» ES EL DE TINTA, no el de la marca: #C8791E
   sobre este mismo tinte da 2.67:1 y el piso de texto normal son 4.5. Es la
   cifra que recepcion lee para vender el ultimo cuarto de una categoria, asi
   que era justo la que menos se podia leer. Medido con la formula de WCAG. */
.ohkg .ohkc.una{background:rgba(180,120,20,.14);color:var(--o-atencion-t);
  font-weight:var(--o-fuerte)}
.ohkg .ohkc.cero{background:rgba(190,60,60,.14);color:var(--o-alarma);
  font-weight:var(--o-fuerte)}
.ohkg .ohkc.pend{font-size:var(--o-nota);color:var(--o-atencion-t)}
/* UN SOLO AVISO A LO ANCHO DE LA FILA (ronda 2.2). Cuando el tipo no tiene
   cupo en ningun dia, su fila «A la venta» trae UNA celda que abarca los
   catorce dias en vez de catorce celdas que repiten la palabra. Va pegada a
   la izquierda, junto a la etiqueta fija, para que se lea sin tener que
   desplazar la rejilla, y no se parte en dos renglones. */
.ohkg .ohkc.pend.uno{justify-content:flex-start;padding:0 var(--o-e3);
  white-space:nowrap;text-align:left}
.ohkg .ohkl.lv{min-height:32px}
.ohkg .ohkl.lv b{font-size:var(--o-cuerpo)}

/* Una celda libre. Sin borde: el hueco de 2 px ya la separa. */
.ohkg .ohkcel{background:var(--o-super);border:0;border-radius:var(--o-radio-ctl);
  min-height:44px;padding:0;cursor:pointer;
  transition:background var(--o-mov) var(--o-curva)}
.ohkg .ohkcel.fs{background:var(--o-fondo)}
.ohkg .ohkcel:hover{background:var(--o-acento-suave)}
.ohkg .ohkcel.sel{background:var(--o-acento-suave);box-shadow:inset 0 0 0 2px var(--o-acento)}
.ohkg .ohkcel.dest{background:var(--o-acento-suave)}
/* Hoy: una línea de acento, no un bloque de color. */
.ohkg .ohkhoy{box-shadow:inset 2px 0 0 var(--o-acento)}

/* Las reservas, como barras redondeadas. */
.ohkg .ohkbar{position:relative;display:flex;flex-direction:column;justify-content:center;
  gap:1px;border:0;border-radius:var(--o-radio-ctl);min-height:44px;
  padding:0 var(--o-e3);overflow:hidden;cursor:grab;text-align:left;
  color:#fff;font:inherit;
  transition:opacity var(--o-mov) var(--o-curva),transform var(--o-mov) var(--o-curva)}
.ohkg .ohkbar:active{cursor:grabbing}
.ohkg .ohkbar .n{font-size:var(--o-cuerpo);font-weight:var(--o-fuerte);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ohkg .ohkbar .s{font-size:var(--o-nota);opacity:.85;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ohkg .ohkbar.rec{background:var(--o-acento)}
.ohkg .ohkbar.canal{background:var(--pizarra)}
/* EL BLOQUEO SE LEE, Y ASI NO SE LEIA. Medido a 1440 el 30-sep-2026: texto
   blanco sobre el rayado claro de --acero, «Mantenimiento» apenas se
   distinguia del propio rayado. Un bloqueo mal leido es un cuarto que alguien
   cree libre. Ahora el fondo es claro y el texto oscuro: sigue siendo la
   franja rayada de siempre y ademas se lee. */
.ohkg .ohkbar.blo{background:var(--sand);color:var(--o-texto2);
  background-image:repeating-linear-gradient(45deg,rgba(22,40,50,.14) 0 4px,
    rgba(0,0,0,0) 4px 8px)}
/* RONDA 3 · sobre el gris del rayado, el terciario da 3.94:1. La franja de un
   bloqueo es clara a proposito -para que «Mantenimiento» se lea sobre el
   rayado, ronda 2.2- y por eso su segunda linea necesita su propio tono, no
   el de las notas sobre tarjeta. #45505A da 6.1 sobre ese gris. */
.ohkg .ohkbar.blo .s{opacity:1;color:#45505A}
.ohkg .ohkbar.apagada{opacity:.28}
.ohkg .ohkbar.hallada{box-shadow:0 0 0 2px var(--o-atencion)}
.ohkg .ohkbar.arrastrando{opacity:.4}
.ohke{position:absolute;top:0;bottom:0;width:12px;cursor:ew-resize;
  background:rgba(255,255,255,.001)}
.ohke.i{left:0}.ohke.d{right:0}
.ohkg .ohkbar:hover .ohke{background:rgba(255,255,255,.28)}

/* La confirmación de una línea del arrastre. */
.ohkconf{display:flex;flex-wrap:wrap;gap:var(--o-e2);align-items:center;
  background:var(--o-super);border:1px solid var(--o-acento);
  border-radius:var(--o-radio);padding:var(--o-e2) var(--o-e3);
  margin:0 0 var(--o-e3);font-size:var(--o-cuerpo);color:var(--o-texto)}
.ohkconf input{font:inherit;font-size:var(--o-cuerpo);color:var(--o-texto);
  background:var(--o-fondo);border:1px solid var(--o-linea-f);
  border-radius:var(--o-radio-ctl);padding:var(--o-e1) var(--o-e2);
  min-height:44px;flex:1 1 200px;min-width:0}
.ohkconf .ohb{flex:0 0 auto}

/* La bandeja de Por asignar. */
.ohkban{background:var(--o-super);border:1px solid var(--o-linea);
  border-radius:var(--o-radio);padding:var(--o-e4);display:grid;gap:var(--o-e3);
  align-content:start}
.ohkban>h2{margin:0;font-size:var(--o-titulo);font-weight:var(--o-fuerte);
  color:var(--o-texto);display:flex;justify-content:space-between;gap:var(--o-e2)}
.ohkban>h2 b{font-size:var(--o-cuerpo);color:var(--o-texto3)}
.ohkbant{border:1px solid var(--o-linea-f);border-radius:var(--o-radio-ctl);
  padding:var(--o-e3);display:grid;gap:var(--o-e1);background:var(--o-fondo);
  text-align:left;font:inherit;width:100%;cursor:pointer}
.ohkbant:hover{border-color:var(--o-acento)}
.ohkbant .n{font-size:var(--o-cuerpo-f);font-weight:var(--o-fuerte);color:var(--o-texto)}
.ohkbant .d{font-size:var(--o-nota);color:var(--o-texto3)}

/* ── LA CAJA Y EL CORTE ─────────────────────────────────────────────────────
   Una cifra héroe con su estado, cuatro números en una fila y una tabla
   alineada de verdad: números a la derecha y cifras tabulares. */
.ohqestado{display:inline-flex;align-items:center;gap:var(--o-e2);
  font-size:var(--o-cuerpo);font-weight:var(--o-fuerte);border-radius:999px;
  padding:var(--o-e1) var(--o-e3);min-height:32px}
.ohqestado.bien{background:var(--o-bien-suave);color:var(--o-bien)}
.ohqestado.mal{background:rgba(190,60,60,.12);color:var(--o-alarma)}
.ohqestado.sin{background:rgba(180,120,20,.14);color:var(--o-atencion-t)}
.ohqfila{display:grid;gap:var(--o-e3);grid-template-columns:repeat(2,minmax(0,1fr));
  margin:var(--o-e4) 0}
@media(min-width:768px){.ohqfila{grid-template-columns:repeat(4,minmax(0,1fr))}}
.ohqn{background:var(--o-super);border-radius:var(--o-radio);padding:var(--o-e3) var(--o-e4);
  box-shadow:var(--o-sombra);display:grid;gap:var(--o-e1)}
.ohqn span{font-size:var(--o-nota);color:var(--o-texto3)}
.ohqn b{font-size:var(--o-titulo);font-weight:var(--o-fuerte);color:var(--o-texto);
  font-variant-numeric:tabular-nums}
.ohqt{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.ohqt th{font-size:var(--o-nota);font-weight:var(--o-fuerte);color:var(--o-texto3);
  text-align:left;padding:var(--o-e2) var(--o-e3);border-bottom:1px solid var(--o-linea)}
.ohqt td{font-size:var(--o-cuerpo);color:var(--o-texto);padding:var(--o-e3);
  border-bottom:1px solid var(--o-linea);vertical-align:top}
.ohqt th.num,.ohqt td.num{text-align:right;white-space:nowrap}
.ohqt td.num{font-weight:var(--o-fuerte)}
.ohqt tr:last-child td{border-bottom:0}
.ohqsc{overflow-x:auto;background:var(--o-super);border-radius:var(--o-radio);
  box-shadow:var(--o-sombra)}
.ohqmen{font-size:var(--o-nota);color:var(--o-texto3)}

/* ── LA TABLA DEL CORTE, EN RENGLON DE DOS LINEAS EN EL TELEFONO ───────────
   MEDIDO POR ARQUI A 390 EN LA RONDA 2.1: cinco columnas no caben, las
   celdas se partian («29 / sep») y el monto se cortaba en la orilla («$1,»).
   Una cifra cortada en la pantalla del dinero es una cifra que miente, asi
   que en el telefono la fila se acomoda como ficha y NO como tabla angosta.
   EL CORTE ESTA EN 560 Y NO EN 430 A PROPOSITO: 430 es un ancho que Arqui
   MIDE, no el unico que existe, y una regla que empieza justo en el punto de
   medicion deja fuera los anchos de en medio. De 561 para arriba —el iPad del
   mostrador a 768 incluido— manda la tabla, que es donde comparar dos montos
   en columna vale la pena. */
.ohqlis{display:none}
@media(max-width:560px){
  .ohqsc.conlis>.ohqt{display:none}
  .ohqsc.conlis>.ohqlis{display:grid}
}
.ohqli{display:grid;gap:var(--o-e1);padding:var(--o-e3) var(--o-e4);
  border-bottom:1px solid var(--o-linea)}
.ohqli:last-child{border-bottom:0}
.ohqli .a{display:flex;align-items:baseline;gap:var(--o-e3)}
.ohqli .a .q{flex:1 1 auto;min-width:0;font-size:var(--o-cuerpo-f);
  color:var(--o-texto);overflow-wrap:anywhere}
.ohqli .a .m{flex:0 0 auto;text-align:right;white-space:nowrap;
  font-variant-numeric:tabular-nums}
.ohqli .a .m b{font-size:var(--o-cuerpo-f);font-weight:var(--o-fuerte);
  color:var(--o-texto)}
.ohqli .b{font-size:var(--o-nota);color:var(--o-texto3);overflow-wrap:anywhere}
.ohqli .b .ohqmen{color:var(--o-texto3)}
.ohqpend{color:var(--o-atencion);font-weight:var(--o-fuerte)}
.ohqacc{display:flex;flex-wrap:wrap;gap:var(--o-e2);margin:var(--o-e4) 0 0}
/* UN PENDIENTE NO ES UN ERROR, y con la raya roja de .oherr lo parecia. Lo que
   el corte tiene que decir —que falta la moneda de un movimiento, que un turno
   sigue abierto— es un dato que falta, no una falla: va en ambar, que es el
   color que el sistema de diseno reserva para «atencion». */
.ohqav{background:var(--o-super);border-radius:var(--o-radio);
  box-shadow:var(--o-sombra);border-left:3px solid var(--o-atencion);
  padding:var(--o-e3) var(--o-e4);margin:var(--o-e4) 0 0;display:grid;
  gap:var(--o-e2);font-size:var(--o-cuerpo);color:var(--o-texto2)}

/* ── LA AYUDA ───────────────────────────────────────────────────────────────
   Tres escalones, tres tarjetas limpias, en el orden que pidió Eduardo. */
.ohy3{display:grid;gap:var(--o-e4);margin:0 0 var(--o-e5)}
@media(min-width:768px){.ohy3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ohyc{background:var(--o-super);border-radius:var(--o-radio);padding:var(--o-e4);
  box-shadow:var(--o-sombra);display:grid;gap:var(--o-e2);align-content:start}
.ohyc .p{font-size:var(--o-nota);font-weight:var(--o-fuerte);color:var(--o-texto3)}
.ohyc h2{margin:0;font-size:var(--o-titulo);font-weight:var(--o-fuerte);color:var(--o-texto)}
.ohyc p{margin:0;font-size:var(--o-cuerpo);color:var(--o-texto2)}
.ohyc .ohb{margin-top:var(--o-e2);justify-self:start}
.ohyq{display:grid;gap:0;background:var(--o-super);border-radius:var(--o-radio);
  box-shadow:var(--o-sombra);overflow:hidden}
.ohyq>div{border-bottom:1px solid var(--o-linea)}
.ohyq>div:last-child{border-bottom:0}
.ohyq button.q{width:100%;text-align:left;font:inherit;font-size:var(--o-cuerpo-f);
  font-weight:var(--o-fuerte);color:var(--o-texto);background:none;border:0;
  padding:var(--o-e3) var(--o-e4);min-height:44px;cursor:pointer;
  display:flex;gap:var(--o-e3);align-items:center;justify-content:space-between}
.ohyq button.q:hover{background:var(--o-fondo)}
.ohyq .sig{color:var(--o-acento-t);font-size:var(--o-titulo);line-height:1;flex:0 0 auto}
.ohyq .cu{padding:0 var(--o-e4) var(--o-e4);display:grid;gap:var(--o-e2)}
.ohyq .cu ol{margin:0;padding-left:var(--o-e5);display:grid;gap:var(--o-e1);
  font-size:var(--o-cuerpo);color:var(--o-texto2)}
.ohyq .cu .nota{font-size:var(--o-nota);color:var(--o-texto3)}
.ohygrp{font-size:var(--o-nota);font-weight:var(--o-fuerte);color:var(--o-texto3);
  margin:var(--o-e5) 0 var(--o-e2)}

/* DOS PESOS Y NADA MAS, Y ESTO SE MIDIO ROTO PRIMERO. La hoja base del sistema
   le da 900 a <b>, asi que un <b> dentro de una pieza nueva sale con un TERCER
   peso sin que nadie lo haya pedido: medido a 1440 en la rejilla, «Por asignar»
   traia un 900 suelto. Los <b> de las piezas de esta ronda se traen al 600 del
   sistema de diseno. */
.ohkban b,.ohkg b,.ohqfila b,.ohqt b,.ohy3 b,.ohtot-r b,.ohkconf b{
  font-weight:var(--o-fuerte)}

/* ══════════════════════════════════════════════════════════════════════════
   PARTE 2 · LOS CINCO TAMANOS Y LOS DOS PESOS EN LAS PANTALLAS VIEJAS
   Los cinco: 12 (--o-nota), 14 (--o-cuerpo), 16 (--o-cuerpo-f),
   20 (--o-titulo) y 32 (--o-cifra). Los dos pesos: 400 (--o-normal) y
   600 (--o-fuerte).
   ══════════════════════════════════════════════════════════════════════════ */

/* ── LAS CIFRAS DE ARRIBA (.kpi, y sus tres primos) ────────────────────────
   Medido antes: la etiqueta en 10.5 px, peso 700, MAYUSCULAS con 1.2 px de
   espaciado; la cifra en 27 px (y en clamp hasta 27 en .kpi .v de estilo-02),
   peso 700. Tres tamanos fuera de los cinco y un peso fuera de los dos.
   LAS MAYUSCULAS ESPACIADAS SE QUITAN, no se re-escriben en el JS: el texto
   que sale del codigo ya dice «Ocupados», «Salen hoy», «Por limpiar» — el
   grito lo ponia la hoja de estilo. */
body.ohm-opera main .kpi .k,
body.ohm-opera main .card.acc .k,
body.ohm-opera main .hz-nums .k,
body.ohm-opera main .fx-kpi .k{
  font-size:var(--o-nota);font-weight:var(--o-fuerte);
  letter-spacing:normal;text-transform:none;opacity:1;color:var(--o-texto3)}
body.ohm-opera main .kpi .v,
body.ohm-opera main .card.acc .v,
body.ohm-opera main .hz-nums .v,
body.ohm-opera main .fx-kpi .v{
  font-size:var(--o-titulo);font-weight:var(--o-fuerte);line-height:1.2}
body.ohm-opera main .kpi .d{font-size:var(--o-nota);font-weight:var(--o-normal)}

/* ── LA TIRA DE AYUDA DE UNA PANTALLA (.hint) ──────────────────────────────
   Estaba en 13 px. Es una nota, o sea 12. */
body.ohm-opera main .hint{font-size:var(--o-nota);line-height:1.5}

/* ── LA TARJETA DE UN CUARTO ───────────────────────────────────────────────
   Medido antes: numero 21/700, tipo 10.5/600, estado 11.5/400 y 11.5/700,
   etiqueta de limpieza 11/700 con 0.4 px de espaciado, y el avisito de
   «guardando» en 10 px. Cinco tamanos fuera de los cinco.
   El numero del cuarto es el titulo de la tarjeta: 20. Lo demas es nota: 12. */
body.ohm-opera main .cuarto .cnum{
  font-size:var(--o-titulo);font-weight:var(--o-fuerte)}
body.ohm-opera main .cuarto .ctipo{
  font-size:var(--o-nota);font-weight:var(--o-fuerte);letter-spacing:normal}
body.ohm-opera main .cuarto .cest{font-size:var(--o-nota);font-weight:var(--o-normal)}
body.ohm-opera main .cuarto.e-salida .cest,
body.ohm-opera main .cuarto.e-llegada .cest{font-weight:var(--o-fuerte)}
body.ohm-opera main .cuarto .clim{
  font-size:var(--o-nota);font-weight:var(--o-fuerte);letter-spacing:normal}
body.ohm-opera main .cuarto.guardando .cest i{
  font-size:var(--o-nota);letter-spacing:normal}

/* ── EL ENCABEZADO VIEJO, POR SI QUEDA ALGUNO ──────────────────────────────
   vCuartos ya no lo usa (encargo 784, app-19). Esto es la red para cualquier
   otra pantalla de operacion que todavia lo pinte: 33 px de titulo y 16.5 de
   subtitulo son dos tamanos fuera de los cinco, y el peso 700 del boton
   «Volver» es un tercer peso. */
body.ohm-opera main .mh h1{
  font-size:var(--o-cifra);font-weight:var(--o-fuerte);letter-spacing:normal}
body.ohm-opera main .mh-t p{font-size:var(--o-cuerpo-f);font-weight:var(--o-normal)}
body.ohm-opera main .volver{font-size:var(--o-cuerpo);font-weight:var(--o-fuerte)}
body.ohm-opera main .volver span{font-size:var(--o-cuerpo-f)}

/* ── NI UNA MAYUSCULA ESPACIADA MAS, EN NINGUNA PANTALLA DE OPERACION ──────
   El estandar las saca por una razon concreta y no por gusto: en mayusculas
   todas las letras tienen la misma altura, asi que la palabra pierde su
   silueta y se lee mas lento. Se listan las clases medidas, no un selector
   universal: un `*` aqui apagaria tambien las siglas que SI van en mayusculas
   porque asi se escriben. */
body.ohm-opera main .rot,
body.ohm-opera main .seccion-t,
body.ohm-opera main .tbl th,
body.ohm-opera main .lbl-up{letter-spacing:normal;text-transform:none}