/* ===========================================================================
 * LOS TOKENS DE LA CASA · UN SOLO SITIO (2026-08-17)
 * ===========================================================================
 * Esta paleta estaba escrita DOS VECES, identica: dentro del <style> de
 * `conversar.html` (la app) y en `fichas.css` (que sirve a `preparar.html`, el
 * alta). La propia cabecera de `fichas.css` ya lo confesaba. Se comprobo token
 * por token antes de tocar nada: 105 en `:root` y 80 en el tema olivo, mismos
 * nombres, mismos valores, CERO diferencias.
 *
 * ⚠️ QUE LAS DOS COPIAS SEAN IDENTICAS HOY ES EXACTAMENTE EL PROBLEMA. El
 * codigo muerto es inerte; el duplicado DIVERGE, y la copia que sobrevive casi
 * nunca es la mejor. El dia que alguien ajuste un color en la app y no en el
 * alta, la clinica nueva ve una marca distinta a la que le vendimos, y no falla
 * nada: solo se ve raro, que es el fallo mas dificil de encontrar.
 *
 * Lo cargan las dos pantallas con `<link>`. Nada mas define estos tokens.
 *
 * ⚠️ EL ORDEN NO IMPORTA PARA RESOLVERLOS (una custom property se resuelve
 * donde se USA, no donde se declara), pero si importa para el cascade: esto va
 * ANTES que la hoja de cada pantalla, para que se pueda pisar un token
 * puntualmente sin pelearse con el orden de carga.
 * =========================================================================== */

:root{
/* ⚠️ EL FONDO ES EL DEL CLÁSICO (Joe, 2026-08-09: "the main window is still not
   the colour i wanted from the classic app"). Valores de `styles.css`:
   `--shell-2:#0E2A2D` es el lienzo (lo confirma `.app-scroll{background:#0E2A2D}`)
   y `--shell:#123134` son las barras y lo que va encima.

   ⚠️ Y SÓLO CAMBIA EL LIENZO. Probé además invertir `--noche2` para que los
   paneles fueran MÁS CLAROS que el fondo, y estaba mal: Joe, viéndolo, "colours
   are applied to wrong areas". En el clásico el riel es lo MÁS OSCURO de la
   pantalla y el lienzo es lo que se aclara, no al revés. `--noche2` lo usan 26
   sitios, entre ellos el riel y la barra de arriba, así que aclararlo levantaba
   justo lo que tiene que quedarse atrás.

   Lo que de verdad aligera la lista son las rayas blancas al 7%, que ya están, y
   este lienzo. Nada más. */

/* ===========================================================================
   ⚠️ ESTE ES EL ÚNICO SITIO DE LA APP DONDE UN HEXADECIMAL ES LEGAL.
   ===========================================================================
   La fuente es `Ali/LENGUAJE-ali.md`, sección 1. Si una pantalla y ese
   documento no coinciden, manda el documento. Si hace falta un tono que no
   está, se añade AL DOCUMENTO primero, con su nombre de función y una frase de
   qué significa, y después se usa. Nunca al lado.

   Los nombres son DE FUNCIÓN, no de sitio. `--noche2` decía dónde se pintaba,
   así que nada impedía usar el mismo tono para dos cosas distintas, que es
   exactamente lo que le pasó al coral. `--cromo` dice qué es, y sólo eso. */

/* SUPERFICIES. El riel es lo MÁS OSCURO y el lienzo es lo que se aclara.
   ⚠️ `--cromo` es `#0A2220` y NO el `#123134` que dice el documento. Se probó
   ese valor exacto el 2026-08-09 (commit `944864b`) y Joe lo tumbó viéndolo en
   vivo: "colours are applied to wrong areas". Se revirtió en `ab3fcd8`. El
   documento copió el `--shell` del clásico sin arrastrar esa reversión, y está
   corregido allí en este mismo commit. */
--lienzo: #0B1918;

/* ⚠️ `--cromo` ESTABA HACIENDO TRES TRABAJOS, Y SE PARTE EN TRES (2026-08-12).
   De noche funciona porque los tres son oscuros; con un tema claro deja de
   funcionar, porque uno de los tres sigue siendo oscuro y los otros dos no.
   Las tres valen lo mismo aquí a propósito: el tema de noche no cambia. */
--cromo: #12201F;     /* A · el riel y las barras de la app. OSCURO en los dos temas */
--tarjeta: #12211F;   /* B · lo que se apoya encima del lienzo: tarjetas, hojas, paneles */
--campo: rgba(255,255,255,.06);     /* C · el fondo de un campo. Hereda del sitio donde vive */

--superficie: #162624;
/* ⚠️ SUBIDA UN PELDAÑO EL 2026-08-28, y el motivo se mide. El relleno de una
   tarjeta se separa de su lienzo por 1,10:1 de noche y 1,06:1 de día, o sea
   NADA: el borde es lo ÚNICO que identifica la pieza, y para eso la WCAG 1.4.11
   pediría 3:1. Estaba en 1,49 (noche) y 1,25 (olivo).
   No se sube a 3:1 a propósito: ahí la app se lee como una hoja de cálculo, y
   se vio en la maqueta. Se sube al peldaño donde los DOS temas se leen igual de
   fuertes, que no es el mismo número en cada uno: un borde oscuro sobre fondo
   oscuro rinde menos que su ratio. Noche 2,53:1 · olivo 1,75:1. Joe lo eligió
   mirando los cinco peldaños, no leyendo la tabla. */
--raya: rgba(255,255,255,.10);      /* 2,53:1 sobre el lienzo. UNA sola raya. Antes eran dos
                        (`--linea`, `--linea2`) y la segunda separaba por
                        sombra, o sea que no se veía */

/* ⚠️ Y LA TINTA DEL RIEL TAMBIÉN SE PARTE. Dentro del cromo el texto se lee
   siempre en crema, EN LOS DOS TEMAS, porque es la misma superficie oscura.
   Estas cuatro NO cambian con el tema, y por eso valen exactamente lo mismo
   que sus hermanas de noche: usarlas dentro del cromo no mueve un píxel hoy y
   es lo que deja que el tema claro no las arrastre. */
--riel-tinta: rgba(255,255,255,.94);
/* ⚠️ ERA .62 Y SUBE A .66 (2026-09-10). Con el resplandor del cromo siguiendo
   la hora, el peor par de la cabecera de la Agenda pasó a ser este apagado
   sobre la luz del amanecer: 6,56 medido contra el píxel real, y el suelo de la
   casa es 7. A .66 da 7,25. Sube, nunca baja: un subtítulo que no se lee ya fue
   la primera queja de Joe sobre esta pantalla. */
--riel-apagado: rgba(255,255,255,.66);
--riel-superficie: rgba(255,255,255,.06);
/* EL DIBUJO DE UN RENGLON DEL MENU, QUE NO ES SU TEXTO (2026-09-13). Joe, por
   tercera vez: *"the menu changes ... when i click on a page away from the
   home"*. Medido a 1440 los renglones caen al mismo pixel en las dos hojas; lo
   que cambiaba era el COLOR del icono, .66 en las secciones contra .42 en la
   portada, y un icono al mismo peso que su texto aplana la fila entera. Gana
   el .42 de la portada, que es la que Joe senala, y es legal: un dibujo no es
   texto, su suelo es 3:1 (WCAG 1.4.11) y aqui mide 4,02 sobre `--cromo`.
   El ROTULO de grupo va al reves y se queda en `--riel-apagado`: alli el .42
   medía 4,02 con TEXTO encima, por debajo del 4,5 de AA y muy por debajo del
   suelo de 7 de la casa, asi que la que sube es la portada. */
--riel-pista: rgba(255,255,255,.42);
/* LA TARJETA DE ALI EN EL PIE DEL MENÚ (2026-09-13). El lavanda es el color de
   Ali en toda la casa (`--riel-brillo-menta` de noche es este mismo violeta), y
   aquí hace un trabajo que ningún otro color del menú hace: decir que esa
   tarjeta no es un sitio al que ir sino algo que está pasando ahora. Los tres
   valores salen de `.ali` en `inicio.css`, que es de donde se copia la tarjeta. */
--ali-lavanda: #8778CE;
/* ⚠️⚠️ LAS CUATRO FICHAS QUE SÓLO EXISTÍAN DE NOCHE (2026-09-14, Cobros y
   Gastos, `Ali/HANDOVER-cobros-y-gastos.md` §3). Séptima vez de lo mismo: un
   valor que existe de noche y no de día. Las tres de abajo se declaran aquí con
   su valor de noche Y en el bloque `olivo` con su valor de día, medido. Una
   ficha que sólo vive en `:root` hereda el valor de noche sobre papel, y eso es
   un color que no existe en ningún tema (ver `--calculado`, `--sigue-*`).
   · `--cab-tabla`  la tira de cabecera de una tabla o de un panel. De noche es
                    `--superficie`; en lino `--superficie` y `--tarjeta` valen las
                    dos #FFFFFF y la tira DESAPARECE, así que allí es el índice.
   · `--hair`       el filete entre renglones, más fino que `--raya-lista`. Hasta
                    hoy escrito a mano como alfa blanco en varios sitios.
   · `--cliniko-*`  el sello y la barra del libro de Cliniko: teal al 10/32/38 %.
   ⚠️ `--ali-lavanda` y `--calculado` son EL MISMO color en los dos temas. Un
   sello `ALI` y uno `CALCULADO` juntos se leen idénticos: por eso en Cobros el
   sello contesta sólo «de qué libro» (ALI / CLINIKO / LOS DOS) y `CALCULADO`
   sólo se usa donde no hay ningún `ALI` cerca. */
--ali-filo: rgba(135,120,206,.42);
--cab-tabla: var(--superficie);
--hair: rgba(255,255,255,.055);
--cliniko-fondo: rgba(95,216,198,.10);
--cliniko-filo: rgba(95,216,198,.32);
--cliniko-barra: rgba(95,216,198,.38);
--ali-fondo: rgba(120,105,190,.20);
--ali-fondo-roce: rgba(120,105,190,.28);
--ali-pie: rgba(206,199,236,.85);
/* ⚠️ LA TARJETA «Ali contesta» DEL PIE DEL RAÍL VIVE SOBRE EL CROMO, QUE ES
   OSCURO EN LOS DOS TEMAS (2026-09-17). Cuando `--ali-fondo` y `--ali-pie`
   ganaron su valor de día (para las pastillas de Interesados en luz), la
   tarjeta del raíl se quedó con tinta oscura sobre cromo oscuro. Estas tres
   son las del raíl y NO cambian con el tema, como el resto de `--riel-*`. */
--riel-ali-fondo: rgba(120,105,190,.20);
--riel-ali-fondo-roce: rgba(120,105,190,.28);
--riel-ali-pie: rgba(206,199,236,.85);
/* EL MANDO QUE VIVE DENTRO DE UNA FILA (2026-09-13). `Escribir la nota` y
   `Seguir el borrador` en `Mi día` son botones, no sellos, y necesitan un relleno
   que diga «pulsable» sin robarle la fila al nombre del paciente. Son el MISMO
   par que ya usan el estado ámbar y el teal de la casa, sólo que con relleno:
   por eso se nombran por lo que hacen y no por su color.
   ⚠️ EXISTEN PORQUE `mi-dia-pantalla.test.js` PROHÍBE UN LITERAL en esas reglas,
   y tiene razón: la marca de la regla de dolor fue invisible durante semanas por
   un `rgba(255,255,255,...)` escrito a mano que sólo servía en un tema. */
--pide-fondo: rgba(240,180,76,.08);
--pide-fondo-roce: rgba(240,180,76,.16);
--sigue-fondo: rgba(95,216,198,.10);
--sigue-fondo-roce: rgba(95,216,198,.17);
--sigue-borde: rgba(95,216,198,.35);
/* ⚠️ SU META (2026-09-22). Joe, viendo la ficha: *"that blue colour is ok for
   diagnostico not su meta, make meta another colour"*. El azul de «la que sigo»
   es lo que el fisio persigue; la meta es contra lo que se mide el ALTA, así que
   va en la familia verde del alta, en velo y no maciza. Medido: 9,81 sobre su
   velo de noche. */
--meta-fondo: rgba(185,222,140,.09);
--meta-borde: rgba(185,222,140,.32);
--meta-tinta: #B9DE8C;
--riel-raya: rgba(255,255,255,.09);
--riel-roce: rgba(255,255,255,.045);
/* ⚠️ EL RELLENO DE UN CAMPO DENTRO DEL CROMO (2026-08-20). Lo estrena la
   puerta (`entrada.css`), que es la única pantalla hecha entera de cromo, y
   entra como ficha en vez de escribirse ahí porque el día que la app tenga un
   buscador en el riel va a necesitar exactamente este relleno.

   ⚠️ EL 5% ESTÁ POR DEBAJO DEL 6% DE LA PASTILLA A PROPÓSITO, y no es un gusto:
   encima de este relleno va TEXTO ESCRITO (`--riel-tinta`) y su pista
   (`--riel-apagado`), no una cifra corta. La pista es el peor par de la puerta
   y a este 5% mide 7.39 sobre el campo, o sea que pasa el suelo de 7 de la
   casa. Quien lo aclare tiene que volver a medir ESE par, que es el que muerde
   primero, y lo mide la prueba de `entrada.css`, no un documento. */
--riel-campo: rgba(255,255,255,.07);
/* ⚠️ EL RELLENO DE UNA PASTILLA DENTRO DEL CROMO (2026-08-18). Joe, mirando la
   cabecera de la agenda en vivo: "try pills same colour bg". Es UN relleno para
   todas las pastillas, y el color se queda en el texto.

   ⚠️ Y EL 6% NO ES UN GUSTO, ES EL TECHO MEDIDO. Sobre una franja casi negra,
   aclararla lo suficiente para que se vea el chip es exactamente lo que se come
   el contraste de lo que va encima:
     al 12% el coral cae a 5.98 y el ámbar a 6.12  → por debajo del suelo (7)
     al  6% el peor par es 7.21                    → pasa, y aguanta la columna
                                                      de HOY, que ya lleva tinte
   Por eso la pastilla la DIBUJA `--riel-raya` como borde y no la claridad del
   relleno: un borde no está debajo del texto, así que no le quita nada.
   ⚠️ Quien suba este número tiene que volver a medir los cuatro tonos, y sobre
   la columna de HOY, no sobre el cromo pelado. */
--cifra-pastilla: rgba(255,255,255,.07);
/* ⚠️ EL RESPLANDOR DE LA BANDA DE `HOY` (2026-08-28). Son las dos ÚNICAS luces
   que se echan encima del cromo, y viven aquí porque la hoja de la app no puede
   escribir un color: `#fff` a mano en un botón de esa banda fue lo que puso roja
   la prueba `ni un hexadecimal en la hoja de la casa de Ali`.

   El coral es `--necesita-persona` y la menta es `--riel-verde`, los dos con
   alfa: no son tonos nuevos, es la marca encendida sobre una franja casi negra.

   ⚠️⚠️ EL 42% ESTÁ MEDIDO, IGUAL QUE EL 6% DE LA PASTILLA DE ARRIBA. Un
   resplandor ACLARA el suelo bajo el texto, que es exactamente lo que se come el
   contraste. Con el coral al 42% y puesto arriba a la derecha (lejos del texto
   coral), medido contra el píxel real: crema 15,04 · apagado 7,90 · coral 7,42 ·
   verde 8,72 · ámbar 7,78, o sea que el peor par pasa el suelo de 7 de la casa.
   Quien suba este número tiene que volver a medir los cuatro tonos. */
--riel-brillo: rgba(232,138,106,.38);      /* el coral, encendido sobre el cromo */
--riel-brillo-menta: rgba(95,216,198,.12); /* y la menta, mucho más floja */
/* El blanco puro del botón de la banda al pasar por encima. Sobre cromo es el
   único sitio de la app donde un blanco puro es legal: `--riel-tinta` ya es la
   crema, y esto es un peldaño más, no un color nuevo. */
--riel-tinta-viva:#FFFFFF;
/* ⚠️ UN MANDO DENTRO DEL CROMO ES TEAL, NO BLANCO (2026-09-10). `Agendar` y el
   `6` elegido del `1·3·5·6` se pintaban con `--riel-tinta`, o sea con la tinta
   de leer: dos manchas blancas puras en una pantalla que no tiene ninguna otra.
   Es el mismo teal del `Nueva cita` de la portada, para que un mando primario
   se vea igual en toda la app. */
--riel-cta:#0D635C;    /* 7,10 con blanco encima: el suelo de la casa, medido */
--riel-cta-tinta:#FFFFFF;

/* ⚠️ Y HAY DOS OSCUROS, NO UNO (Joe, 2026-08-12: "i want the left menu to stay
   dark but the chat list, the top, and the right panel to be a bit lighter,
   other shade of teal, a bit like before"). El riel es lo MÁS oscuro y se queda
   en `--cromo`; todo lo demás que es oscuro sin ser el riel (la columna de
   Chats, la banda de arriba, la cabecera de la Agenda) va un escalón por
   encima. No es un tono nuevo: es el lienzo del tema de noche, que es
   exactamente el "a bit like before" que pidió, y por eso el tema de noche no
   se mueve al usarlo. */
--barra: #0B1918;
/* La columna de índice. De noche no tiene fondo propio (es el lienzo), y en
   el tema claro es una hoja un punto más honda que la página. */
/* LA HOJA: lo que se LEE y se TRABAJA (la conversación, una sección, los
   ajustes, la rejilla de la agenda). De noche es el lienzo de siempre, así que
   usarla no mueve nada allí; en el tema claro es el papel, un punto por encima
   de la página. Ver 1.4b del lenguaje: la página, el índice, la hoja y el
   bloque son CUATRO planos y cada uno tiene su trabajo. */
--hoja: #0B1918;
/* La columna de índice. De noche no tiene fondo propio (es el lienzo), y en
   el tema claro es una hoja un punto más HONDA que la página. */
--indice:transparent;
--ix-raya:var(--raya);
/* Y lo de dentro del índice: el disco de una persona y la fila elegida. */
--ix-campo:var(--campo);
--ix-avatar:var(--avatar);
--ix-avatar-tinta:var(--avatar-tinta);
--ix-avatar-borde:0;
--ix-elegido:var(--elegido);

/* El peaje de una cabecera oscura en tema claro: las cifras del día que viven
   dentro del cromo tienen que seguir usando los tonos de NOCHE, porque los del
   tema claro están hechos para leerse sobre papel y ahí se enfangan. */
/* ⚠️ ERA EL LIMA #A9D97E, DEL TEMA OLIVO (2026-09-10). Dentro del cromo se
   peleaba con la menta de la marca, que ya es #5FD8C6 en el resplandor, en los
   estados y en la portada: dos verdes distintos para decir lo mismo. */
--riel-verde: #5FD8C6;
--riel-ambar: #E0A85C;
--riel-coral: #EA9578;   /* el mismo de arriba: ver la nota de --necesita-persona */

/* EL FONDO DE UNA CABECERA. De noche no hay: el título cae directo sobre el
   lienzo, que es como está hoy. En el tema claro las dos cabeceras (Agenda y
   Chats) se meten dentro del cromo, y esta ficha es todo el interruptor. */
--cab-fondo:transparent;

/* VELOS Y ROCES. Eran veinte `rgba` blancos sueltos repartidos por la hoja, con
   dos opacidades para el mismo trabajo. Sobre papel un velo blanco no existe,
   así que tenían que tener nombre antes de que hubiera papel. */
--roce: rgba(255,255,255,.045);      /* el fondo al pasar por encima */
/* LA MARCA DE AGUA del campo vacío. Existía escrita a mano dos veces en
   `conversar.html` como blanco al 34%, o sea invisible sobre papel: el
   buscador de Pacientes se veía como una caja blanca vacía en el tema claro
   (Joe, 2026-09-14). Misma relación en los dos temas, 3,1 a 1: se lee que hay
   algo escrito, y no se confunde con un valor puesto. */
--marca-agua: rgba(255,255,255,.34);
--elegido: rgba(255,255,255,.07);  /* el fondo de la fila elegida */
/* ⚠️ LA FILA ABIERTA DE CHATS TIENE SU PROPIA FICHA, Y NO ES `--elegido`.
   Reinstalada el 2026-08-18: se construyó el 17 (`db64edc`) y se cayó por
   arrastre al revertir el teal oscuro entero, que era otra cosa. Joe: "the
   highlighted chat was meant to be reverted to how it was before, just a shade
   darker".
   `--elegido` es un VELO y da un color distinto según sobre qué caiga
   (`#D7D9C3` sobre el índice, `#EBECE3` sobre el papel), así que con él no se
   puede fijar el contraste del texto en un número. La lista de Chats siempre se
   apoya en `--indice`, así que aquí va un tono MACIZO.
   ⚠️ `--elegido` NO se toca: lo usan nueve reglas de roce y selección por toda
   la app. De noche esto vale la superficie de siempre y no mueve nada. */
--elegido-hondo:var(--superficie);
/* La raya que separa dos renglones de una lista. De noche es blanca al 7% (que
   separa por LUZ y no por sombra, ver la nota de `.wa-r + .wa-r`); en papel esa
   raya no se ve y vuelve a ser la raya de siempre. */
--raya-lista: rgba(255,255,255,.08);

/* EL GLOBO QUE ESCRIBISTE TÚ. No es un color nuevo: de noche es exactamente
   `--superficie`, que es lo que tenía escrito a mano. Existe porque en el tema
   claro la tarjeta y la superficie valen lo mismo, y sin esto los dos globos de
   un chat (el que llega y el que mandas) quedaban idénticos. */
--globo-mio: #162624;

/* LA LÍNEA DEL PORQUÉ, Y LO QUE LA ACOMPAÑA EN LA LISTA DE CHATS.
   ⚠️ ESTO ESTÁ DETRÁS DE UNA FICHA A PROPÓSITO, Y NO ES DECORACIÓN. En el tema
   claro el coral deja de ser texto y esta línea se lee en tinta llena con peso,
   porque en papel manda el valor y no el matiz: cuarenta frases naranjas son una
   textura, cuarenta frases negras debajo de un mensaje gris son una lista que se
   lee. Y "cero coral = no hace falta nadie" se vuelve MÁS legible, no menos: se
   cuenta una pastilla en vez de leer cuarenta renglones.
   ⚠️ CONTRADICE LA SECCIÓN 4.3 DEL LENGUAJE, que fija esta línea en
   `--necesita-suave` y la llama "la pieza más valiosa de la app". Está aplicado
   y Joe todavía NO lo ha confirmado por escrito: vive detrás de estas dos fichas
   para que revertirlo sea una línea y no una cacería. */
--porque:var(--necesita-suave);
--porque-peso:400;

/* ===========================================================================
   LOS COLORES DE LA AGENDA
   ===========================================================================
   ⚠️ LA AGENDA ENTERA ESTABA CONSTRUIDA SOBRE BLANCO A BAJA OPACIDAD. Eso sólo
   existe encima de un fondo oscuro: sobre papel no hay nada más claro que el
   papel, así que un bloque de cita deja de ser LUZ sobre el lienzo y pasa a ser
   TINTA sobre él. Y "no llegó" invierte su mecanismo: de noche se hunde, en
   papel se desvanece hacia el papel.
   Aquí los valores son los de noche, tal cual estaban escritos en cada regla.
   Sacarlos a fichas no cambia ni un píxel: es lo que deja cambiarlos luego. */
/* ⚠️ UNA SESIÓN PASA A SER AZUL (Joe, 2026-08-19: *"use this lovely blue colour
   for the general sesion de fisioterapia"*, señalando el azul de la maqueta).
   Antes era un velo blanco sin matiz, o sea "una cita y punto". El azul le da
   cuerpo al día: lo ocupado se lee de un vistazo contra el papel de un hueco
   libre, sin tener que leer un solo nombre.
   ⚠️ NO ES EL MISMO TOKEN QUE `--bloque-dm`, aunque hoy valgan lo mismo. Ese
   azul lo usan una docena de piezas de `nota.css` (lo copiado, lo entregado, el
   cobro) y la pastilla de `CONSULTA` en Chats; si un día la sesión cambia de
   color, esas piezas NO tienen por qué moverse con ella. Dos conceptos que
   comparten valor siguen siendo dos fichas. */
--bloque:rgba(125,180,220,.20);         /* una sesión */
--bloque-roce:rgba(125,180,220,.29);
--bloque-meta:#A9CFE8;                  /* la línea de abajo, ya sobre el azul */
--bloque-val:rgba(120,216,170,.21);     /* valoración */
--bloque-val-roce:rgba(120,216,170,.3);
--bloque-val-tinta:#E9FBF1;
--bloque-val-meta:#9FE7C2;
--bloque-val-filo:rgba(4,33,31,.38);   /* el sello DENTRO del bloque macizo */
--bloque-val-filo-on:rgba(4,33,31,.55);
--bloque-val-pt:#0B4A3E;              /* el punto de estado, sobre menta */
--bloque-val-pun:#8C3220;
--bloque-dm:rgba(125,180,220,.20);      /* el azul de uso general: `nota.css` y la etapa `CONSULTA` */
--bloque-dm-roce:rgba(125,180,220,.29);
--bloque-dm-tinta:#EAF4FB;
--bloque-dm-meta:#A9CFE8;
/* ⚠️ Y LA DESCARGA MUSCULAR SE MUDA DE COLOR, porque el azul se lo quedó la
   sesión (Joe, el mismo día: *"if it clashes with descarga muscular well change
   descarga muscular to a fitting colour"*). Sí chocaba: era literalmente el
   mismo `--bloque-dm`.
   Se va a una lavanda, y no a un cuarto verde ni a un ámbar, porque los dos
   sitios libres del vocabulario son ésos: el coral significa *una persona te
   necesita* y la miel *falta algo*, y ninguno se puede gastar en un tipo de
   servicio. Medido: ΔE00 14.2 contra el azul de la sesión, 23.9 contra el verde
   de una valoración y 15.6 contra el papel coral, o sea que se separa MÁS de sus
   dos vecinas que ellas entre sí (13.8). Y encima lleva su palabra escrita
   dentro ("Descarga muscular"), que es lo que dice la regla cuando el matiz
   solo no puede con el trabajo. */
--bloque-desc:rgba(226,199,168,.26);
--bloque-desc-roce:rgba(226,199,168,.35);
--bloque-desc-tinta:#FBF2E6;
--bloque-desc-meta:#E8CEAB;
/* EL RELLENO DE UN SITIO LIBRE. De noche un hueco es, literalmente, nada: la
   rejilla se dibuja sobre el lienzo y lo vacío es el lienzo. Existe como ficha
   porque en el tema claro sí tiene cuerpo (ver el bloque olivo). */
--hueco:transparent;
--bloque-ido:rgba(0,0,0,.26);           /* no llegó */
--bloque-ido-roce:rgba(0,0,0,.16);
--bloque-ido-tinta:rgba(241,247,243,.55);
--rejilla: rgba(255,255,255,.09);       /* la referencia de las horas */
--comida-trama:rgba(126,154,149,.05);   /* la trama de la comida */
--cerrado-trama:rgba(255,255,255,.012); /* y la de un día que no abre */
--hoy-tinte:rgba(233,120,91,.055);      /* la columna de hoy */
--hoy-borde:rgba(233,120,91,.35);
--hoy-tinte-cab:rgba(233,120,91,.08);   /* y su cabecera, un punto más marcada */

/* TINTA. CÁLIDA, no fría: es lo que hace que se lea como Ali. Dos niveles y no
   tres. `#FFF7EC` contra el `#EAF1EC` de antes es la mitad del problema: un
   blanco con verde dentro, sobre un fondo verde, se lee como terminal. */
--tinta: rgba(255,255,255,.94);
--apagado: rgba(255,255,255,.62);

/* SIGNIFICADO. Cada uno quiere decir UNA cosa.
   ⚠️ El coral es sólo para lo que necesita a una persona, y la consecuencia es
   la que lo hace útil: CERO CORAL EN PANTALLA = NO HACE FALTA NADIE. Esa señal
   sólo funciona si no se usa para nada más. */
/* ⚠️ EL COLOR DE LOS RÓTULOS EN VERSALITAS (`DE QUÉ`, `SOLA`, `CONTESTAR`...).
   TEAL DE MARCA, NO DEL SEMÁFORO: no significa bien, ni te toca, ni a medias.
   Es el único color libre que queda, y por eso lo lleva un rótulo, que no dice
   nada sobre el estado de nada. Lo que NO vale, y está probado:
     · `--tinta` / `--cromo`      compiten con los nombres de las secciones
     · `--necesita-persona`       significa "esto te pide algo"
     · `--est-bien`               significa "bien"
     · `--etapa-consulta`         ya es la etapa `Consulta`
   ⚠️ SON DOS VALORES OBLIGATORIOS: de noche el papel ya es teal oscuro
   (`--lienzo:#0E2A2D`), y el tono de LINO desaparecería contra él. */
--rotulo: #5FD8C6;                  /* Noche · 8,23 a 1 sobre el lienzo */
/* ═══════════════════════════════════════════════════════════════════════════
   EL COLOR DEL MUEBLE (Joe, 2026-08-28)
   ═══════════════════════════════════════════════════════════════════════════
   Joe, después de ver las dos maquetas: *"green"*. Y antes: *"i asked for the
   light theme to feel as good as the dark one... ultimately i will get rid of
   dark and light theme if necessary i just want the best design and colours"*.

   ⚠️ ESTO CAMBIA §1.2 DE `LENGUAJE-ali.md` POR SEGUNDA VEZ, y la primera la
   hizo Joe el 27 de agosto (*"coral means active or highlighting something"*).
   La razón de volver está medida, no es gusto: barriendo las ocho pantallas en
   vivo el 2026-08-28, el coral estaba haciendo SEIS trabajos —la cara de Ali,
   te-toca-a-ti, los botones, el HOY de la agenda, lo elegido y unas notas al
   pie— y `lo elegido` se pintaba de TRES maneras según la pantalla (relleno
   coral, filo coral y relleno casi negro `#252014`).

   LO QUE COMPRA EL CAMBIO, y es la frase entera del producto: **una pantalla
   sin coral significa que nadie te necesita.** Con el coral en el mueble hay
   coral casi siempre y esa lectura no existe.

   ⚠️ EL MUEBLE ES LO QUE SE PULSA Y LO QUE DICE DÓNDE ESTÁS: pestañas,
   segmentos, el renglón del menú, el botón que actúa, la tarjeta que tienes
   puesta, el HOY de la agenda. NUNCA un dato. Y al revés: el coral, el verde de
   `salió bien` y el ámbar de `esperando` son DATOS y no pintan un mando jamás.
   Ese es todo el sistema, y es lo que hay que comprobar antes de añadir color.

   ⚠️ Y SE LLEVA POR DELANTE EL CASI NEGRO. `background:var(--tinta)` era el
   relleno de ocho estados `on` repartidos por la app (`Por fecha`, `Hoy`, los
   segmentos de la agenda, el botón de enviar): el único casi negro del tema
   claro, que no pertenecía a ninguna familia. Ahora son `--mando`.

   Medido: `#6FD0BC` con `--sobre-mando` encima da 8,23 a 1 de noche;
   `#0F5C55` con `--lienzo` encima da 7,23 a 1 en el día. Los dos por encima del
   piso de 7 que esta casa se puso el 2026-08-12. */
--mando: #5FD8C6;
--mando-hondo: #12857B;      /* 7,36 · el pulsado. De noche el mando es CLARO,
                               así que "hondo" aquí baja poco: por debajo de
                               esto la tinta oscura de encima deja de pasar. */
--sobre-mando: #04211F;      /* la tinta que va ENCIMA del mando */
/* ⚠️ ERA #E88A6A Y SE ACLARA (2026-09-10). Ese coral estaba medido contra el
   lienzo VIEJO. Con el lienzo nuevo (#0B1918) medido sobre el pixel real de la
   cabecera de la Agenda daba 6,46 y el suelo de la casa es 7: «2 sin confirmar»
   era el peor par de la pantalla. #EA9578 da 7,08 y es el mismo coral. */
--necesita-persona: #EA9578;
--necesita-suave: #F0A88E;   /* coral claro, para texto sobre oscuro */
--necesita-hondo: #D4694A;   /* coral hondo, para pulsado */
--necesita-borde:#4A2A22;   /* el borde de una caja que necesita a una persona */
--necesita-fondo:#2A1C18;   /* y su fondo apagado */
--sobre-coral:#20120C;      /* la tinta que va ENCIMA del coral */
--falta-algo: #E0A85C;       /* miel: falta algo, pero no de ti */
--por-vender: #7FB84E;       /* verde: dinero por vender. Los huecos */
--por-vender-suave: #A9D97E; /* ese mismo verde para TEXTO sobre oscuro.
                               ⚠️ Nunca un punto de estado: mide ΔE 11.9 y a 7px
                               no se distingue del ámbar. Ver `--est-*` abajo */

/* LA ETAPA DE UNA PERSONA. Son tres, y NO son estados: un estado dice si algo
   está bien o mal, una etapa dice en qué punto del camino va. Por eso no salen
   de `--est-*`, y por eso el coral no aparece en ninguna de ellas.
   ⚠️ LA MARCA VA APARTE DE LA TINTA aunque de día valgan lo mismo. El punto del
   filtro y el relleno del chip encendido se pintan sobre superficies distintas
   que la palabra de la etiqueta, y de noche eso los separa: aquí la tinta de
   `Consulta` es casi blanca y como punto de 6px no diría nada. */
--etapa-consulta:#EAF4FB;                     /* la palabra, sobre su pastilla */
--etapa-consulta-fondo:rgba(125,180,220,.20); /* la misma pastilla que un bloque DM */
--etapa-consulta-marca:#7FA8C9;               /* el punto del filtro y el relleno del chip */
--etapa-alta:#8FD3B0;                         /* la pastilla maciza de un alta */
--etapa-alta-tinta:#0A2220;                   /* y lo que se escribe encima · 9.59 */
--etapa-alta-marca:#8FD3B0;
--necesita-fondo-on:#3A2620;                  /* el papel de Ali cuando está elegida */

/* ESTADO DE UN DATO. OJO: NO son los mismos que los de arriba, y no es un
   descuido. Se validaron aparte para que se distingan entre sí en un punto de
   7px, que es donde el verde y el ámbar de marca fallan.
   ⚠️ Sólo en PUNTOS Y MARCAS de estado. Nunca en texto, nunca en fondos.
   (Vivían en un segundo `:root` a mitad de la hoja. Un lenguaje con dos sitios
   donde mirar es un lenguaje que nadie mira.) */
--est-bien: #5FD8C6;
--est-falta: #E0A85C;
--est-mal: #EA9578;   /* aclarado con el coral: ver la nota de --necesita-persona */
--est-neutro: #8A9895;

/* ═══ HOY · LA PANTALLA DEL TURNO (2026-09-15) ═══════════════════════════
   Cuatro familias nuevas, cada una con su OFICIO (una ficha se reusa por lo
   que significa, no por su tono; `Ali/HANDOVER-inicio-hoy.md` §10):
   · `--tipo-*`  el TIPO de una cita es el color de su tarjeta, con clave al
                 pie: pálido la sesión, hondo la valoración. Un solo tono de
                 la casa a dos fuerzas, no dos colores.
   · `--ahora*`  el único coral que no sale en ningún otro sitio: la hora en
                 curso. DOS tonos: `--ahora-viva` es el punto y el trazo,
                 `--ahora` es la TINTA. El vivo a 11px sobre papel da 3,6 y no
                 se lee; es el mismo reparto que `--est-falta` / `--falta-tinta`.
   · `--turno-*` el gráfico de quién está en piso. ⚠️ NO SE PINTA IGUAL EN LOS
                 DOS TEMAS y no es capricho: de noche funciona por LUZ (canal
                 excavado, barra menta con filo brillante); de día por TINTA
                 (canal macizo un tono más oscuro que la ficha, barra sólida
                 SIN filo). Un alfa no se traduce entre temas.
   · `--tipo-*`  ⚠️⚠️ UNA ESCALERA POR RAREZA, NO CINCO COLORES (Joe,
                 2026-09-15). Probado y descartado: el mismo teal a dos fuerzas,
                 y dos familias enteras (lavanda contra teal). Las dos fallan
                 igual, porque piden COMPARAR dos tarjetas para saber cuál es
                 cuál, y con cinco servicios eso ya no escala. Los tipos no son
                 iguales en la vida real: 9 de cada 10 citas son sesiones. Así
                 que el peso va por rareza —cuanto menos común, más oscura—:
                 sesión casi blanca con filete, descarga en gris CÁLIDO,
                 check-in en gris FRÍO (los dos del mismo rango: se separan por
                 temperatura, 1,03 entre ellos, no por fuerza), y la valoración
                 macIza con la tinta al revés. Con el 90% del día en el escalón
                 de abajo la rejilla queda casi en blanco y lo poco que se
                 despega es justo lo que hay que ver. Una tarjeta oscura entre
                 tarjetas claras no se compara: se ve.
   · `--espina`  la recta vertical del día. `--raya-lista` sobre papel da 1,33
                 y una columna entera invisible: una raya separa dos renglones
                 que ya están juntos, ésta tiene que LEERSE sola. */
/* ⚠️⚠️ DOS FAMILIAS DE COLOR, NO DOS FUERZAS DE LA MISMA (Joe, 2026-09-15:
   *"we need another colour scheme for appointments... lavander"*). Sesión y
   valoración eran el mismo teal a dos intensidades, y en un día que es 95%
   sesiones la rejilla entera quedaba en una sola tinta: había que COMPARAR
   dos tarjetas para saber cuál era cuál. La sesión pasa a LAVANDA, la
   valoración se queda con el teal de la casa. Dos familias se distinguen de
   reojo, sin comparar, que es lo que pide una pantalla donde lo que buscas es
   el 5% que no es una sesión.
   ⚠️ Y LA LAVANDA NO ES DE LA CASA A PROPÓSITO: entra aquí y en ningún otro
   sitio, igual que el coral de AHORA. Un color que sólo sale en un lado sólo
   puede querer decir una cosa. */
--cara-fondo: #162624;
--hueco-filo: rgba(255,255,255,.08);
--pista-canal: rgba(255,255,255,.14);
--pista-hecho: rgba(255,255,255,.40);
--pu-raya: rgba(255,255,255,.10);
--tipo-ses-fondo: rgba(255,255,255,.045);
--tipo-ses-tinta: rgba(255,255,255,.94);
--tipo-ses-filo: rgba(255,255,255,.09);
--tipo-des-fondo: rgba(226,199,168,.26);   /* la arena, de noche */
--tipo-des-tinta: rgba(255,255,255,.94);
--tipo-chk-fondo: rgba(255,255,255,.045);
--tipo-chk-tinta: rgba(255,255,255,.94);
--tipo-val-fondo: #5FD8C6;
--tipo-val-tinta: #04211F;
--ahora: #FF9478;
--ahora-viva: #FF7A5C;
--turno-canal: rgba(255,255,255,.06);
--turno-lleno: rgba(95,216,198,.24);
--turno-borde: #5FD8C6;
--turno-raya: rgba(255,255,255,.22);
--espina: rgba(255,255,255,.34);

/* ── EL DINERO (migración 080). NO SON COLORES NUEVOS: son los `--est-*` de
   arriba con el nombre de lo que significan aquí. El verde es el que ya quiere
   decir "este dato está completo", y el ámbar el que ya quiere decir "falta
   algo". Inventar una paleta para el dinero sería un cuarto lenguaje de estado
   en la misma pantalla.
   ⚠️ "DEBE DINERO" NO ES CORAL, ES MIEL. El coral significa "necesita a una
   persona AHORA", y una deuda es un dato, no una tarea de hoy. El coral aparece
   exactamente dos veces en estas pantallas: el punto de la cita sin apuntar y
   el aviso de la caja.
   ⚠️ Y `--debe` ES LA TINTA DE TEXTO (`--falta-tinta`), NO EL PUNTO
   (`--est-falta`). La pastilla que dice cuánto falta es texto de 11px, y con el
   punto puesto de tinta se queda en 3.1:1 sobre papel: medido en pantalla, no
   leído. Es la regla 1.3 y su corrección del 2026-08-12, que ya había pasado en
   catorce sitios de esta misma hoja. En Noche las dos valen lo mismo. */
--pagado:var(--bien-tinta);
--pagado-punto:var(--est-bien);
--pagado-fondo:rgba(92,199,154,.12);
/* El borde del bloque "resuelto". Va con `--pagado-fondo`: los dos son el par
   del verde de lectura, y un fondo sin su borde se lee como una mancha. */
--pagado-borde:rgba(92,199,154,.32);
--debe:var(--falta-tinta);
--debe-fondo:var(--falta-fondo);
--debe-borde:var(--falta-borde);
--revertido:var(--est-neutro);

/* ⚠️ Y LOS MISMOS TRES ESTADOS, PERO PARA TEXTO (2026-08-12). La regla 1.3 dice
   que los `--est-*` son SÓLO puntos y marcas, y en la hoja había catorce sitios
   pintando texto de 10 a 12px con ellos. De noche no se nota; sobre papel esos
   tonos se quedan en 3.4 y no se leen. Aquí valen exactamente lo mismo que su
   punto, así que el tema de noche no cambia; en el Olivo bajan a un valor que
   sí se lee. El punto NO se toca: sigue validado por separación a 7px. */
--bien-tinta:var(--est-bien);
--falta-tinta:var(--est-falta);
--mal-tinta:var(--est-mal);
/* EL PAPEL DE UNA PASTILLA QUE DICE "ESTO ESTÁ PASANDO". Hermano de
   `--falta-fondo` y de `--necesita-fondo`, que ya existían: era el verde el que
   faltaba, y su pastilla se pintaba con `--pagado-fondo`, que significa una
   cosa distinta (una factura cobrada). El verde de un estado y el verde del
   dinero valen lo mismo hoy y no tienen por qué mañana. */
--bien-fondo:rgba(92,199,154,.14);
--bien-borde:rgba(92,199,154,.32);   /* el filete del acuse en verde; lo usaba `.inf-aviso` sin estar definido */
/* ⚠️ Y EL CORAL TAMBIÉN NECESITA SU TINTA (2026-08-25). `--necesita-persona` es
   el coral de los puntos, los globos y los filos, y se usaba además como color
   de TEXTO. Medido sobre el papel del tema de día: 3,27 a 1, o sea por debajo
   del mínimo. De noche da 5,26 y por eso no se había visto.
   Salió al estandarizar la frase de las cinco cabeceras, donde `<b>` es "esto
   te pide algo" y ahora sale en cuatro pantallas más que ayer.
   Mismo trato que el verde y el ámbar de aquí arriba: el punto no se toca, la
   letra baja a un tono que sí se lee. */
--necesita-tinta:var(--necesita-persona);

/* EL CÍRCULO CON LA INICIAL DE UNA PERSONA. De noche es la superficie de
   siempre; en el Olivo se va al oscuro del riel, que es lo que le da cara a una
   lista de gente sobre papel (Joe, 2026-08-12: "i want the contact circles to
   be the dark colour"). */
/* El disco de una persona, de noche. En el tema claro lo pisa `--ix-avatar`,
   que es quien manda dentro de la columna de índice. */
--avatar: #1B2C2A;
--avatar-tinta: rgba(255,255,255,.94);
/* ⚠️ EL DISCO DE QUIEN ESTÁ EN LA CAMILLA, y por qué son fichas y no colores
   escritos en `dia.css` (2026-08-19). Esa regla pintaba el fondo a mano
   (`--sobre-coral`) y NO ponía su tinta, así que heredaba `--avatar-tinta`. De
   noche eso funciona de casualidad —la tinta del disco ya es crema— y el día de
   LINO lo rompió en cuanto `--avatar-tinta` pasó a ser tinta oscura: disco casi
   negro con letra casi negra, 1.05:1, o sea la inicial desaparecida.
   ⚠️ `dia.css` NO TIENE UNA SOLA REGLA DE TEMA, y ésa es una propiedad que vale
   la pena defender: el arreglo va aquí, en tres fichas, y no en un
   `html[data-tema=...]` que sería el primero de ese archivo.
   De noche se queda EXACTAMENTE como estaba. De día el disco es el de siempre,
   que es lo que manda el lenguaje 1.4c (relleno claro, sin anillo): la fila viva
   ya se distingue por su borde coral, su hora coral y su pastilla, y un disco
   oscuro más sólo le quitaría sitio al coral. */
--avatar-viva:var(--sobre-coral);
--avatar-viva-tinta:var(--avatar-tinta);
--avatar-viva-borde:1px solid var(--necesita-borde);

/* LO QUE SE VE ATENUADO DENTRO DE UN CAMPO VACÍO. Es una opacidad y no un color
   porque el color ya lo pone `--apagado`: lo que cambia entre temas es cuánto
   se puede atenuar antes de dejar de leerse. En papel .55 daba 2.9:1. */
--pista-opac:.55;

/* EL BORDE Y EL FONDO DE UNA PASTILLA DE "FALTA ALGO". Eran la miel de noche
   escrita a mano, y sobre papel una miel al 8% no existe. */
/* ⚠️ EL VELO Y LA SOMBRA DE UNA CAPA QUE FLOTA ENCIMA DE LA APP (2026-08-14).
   `--velo` es lo que oscurece la pantalla detrás de algo que flota (la lupa de
   ⌘K); `--sombra-capa` es lo que la separa del fondo. Existían como `rgba`
   sueltos en cada sitio que abría una capa —el aviso de sesión terminada tenía
   el suyo— o sea dos opacidades para el mismo trabajo y ningún tema que las
   alcance. Sobre papel un velo de tinta no puede pesar lo mismo que sobre el
   olivo, y por eso el tema claro los baja. */
--velo: rgba(4,16,15,.74);
--sombra-capa:0 18px 48px rgba(0,0,0,.38);
/* ── LA PÍLDORA DE QUÉ ES CADA COSA (2026-09-13) ──────────────────────────
   Joe eligió la opción A de la maqueta: una píldora en CADA renglón de
   Servicios, diciendo qué es esa fila. Son SÓLO BORDE Y LETRA, sin relleno:
   una píldora rellena por renglón son diecinueve bloques de color en una
   tabla, que es justo lo que separa a Indicadores del resto de la app
   (6 cajas rellenas contra 34, medido el 2026-09-13).

   Tres intensidades, y el orden importa: lo NORMAL se apaga, lo que hay que
   ver se enciende. La sesión es once de trece renglones, así que va en gris.
   ⚠️ ESTO NO ES SEMÁNTICA NUEVA: `--falta-algo` ya es la miel de la casa y
   `--mando` ya es el verde de "esto está vivo". Sólo se les da el alfa que
   una píldora de borde necesita para leerse sobre la hoja. */
/* ── CALCULADO ───────────────────────────────────────────────────────────
   El violeta de «esto lo saqué yo de otras dos cosas». Vivía como `#9C8FDA`
   escrito a mano dentro de `.ind-de.calc` en conversar.html; se sube a ficha
   porque Servicios lo necesita para las mismas cifras derivadas, y dos copias
   del mismo violeta es como acaban siendo dos violetas.
   ⚠️ NO es un color de estado: no dice bien ni mal, dice «no lo tecleó nadie».
   Una cifra derivada con la misma cara que una tecleada es cómo alguien acaba
   intentando corregir un número que no se puede corregir. */
--calculado: #9C8FDA;
--calculado-filo: rgba(156,143,218,.4);

/* ═══ EL COLOR DE UN PROGRAMA (2026-09-13) ═══════════════════════════════
   Joe: *"i want programs in the coloured tabs to make easier to identify"*.
   En Pacientes hay 1204 renglones y lo primero que se busca es de qué programa
   es cada uno; leer «Fisio Avanzando» y «Fisio Alivio» palabra a palabra es lo
   que hacía falta antes, y las dos empiezan igual.
   ⚠️ NINGUNO ES UN TONO NUEVO: son los seis que la casa ya usa, reunidos aquí
   para que el color de un programa sea UNA ficha y no seis decisiones sueltas.
   ⚠️⚠️ AQUÍ DECÍA «POR ESO VAN DE FILETE Y NUNCA MACIZOS: un chip macizo de
   color sí se lee como un estado», Y ERA FALSO. Lo corrigió Joe el 2026-09-14:
   *"this is unfounded and wrong"*, y *"the filled in pills on patients or on
   services can be simply to distinguish an important thing on the page"*.
   El color se lee como ESTADO cuando es ESCASO y va cargado (tres rojos entre
   cuarenta filas). Cuando TODAS las filas llevan uno de un juego fijo de seis
   sin relación con cómo va nadie, se lee como lo que es: una manera de
   distinguir. Yo tenía la frase escrita aquí y la repetí como si estuviera
   medida; no lo estaba. Los seis pasan a RELLENO.
   ⚠️ Y VAN TODOS AL MISMO VALOR, que es lo que de verdad impide que uno parezca
   más urgente que otro: L 0,358 · C 0,033 en OKLCH, medido sobre los tres
   rellenos que la Agenda ya usa (`--bloque`, `--bloque-val`, `--bloque-desc`,
   §1.4h) y extendido a tres tonos que el sistema no tenía. La tinta de cada uno
   es su MISMO tono a L 0,96, o sea 9,6 a 9,9 sobre su relleno. */
--prog-a: #304233;  --prog-a-tinta: #EAF5EC;
--prog-b: #2E3F4D;  --prog-b-tinta: #E8F3FD;
--prog-c: #3F394C;  --prog-c-tinta: #F3EFFC;
--prog-d: #4D3632;  --prog-d-tinta: #FEEEEB;
--prog-e: #3C3F2B;  --prog-e-tinta: #F1F3E6;
--prog-f: #473A29;  --prog-f-tinta: #F9F0E5;

/* ⚠️⚠️ EL RELLENO DE UNA PÍLDORA NO SE INVENTA: SE PIDE PRESTADO AL BLOQUE
   (2026-09-14). Joe, viendo una maqueta con tonos que yo había generado a croma
   máximo: *"colours from the design system like teal, lavander. these are super
   childish and amateur looking, no where near in line with design system"*.
   Tenía razón, y el error fue de método: generé tonos nuevos para cumplir un
   número de contraste en vez de leer el sistema. **La §1.4h de `LENGUAJE-ali.md`
   ya lo había decidido el 2026-08-19**, con tabla, hexes elegidos por Joe y una
   prueba que los fija:
       Sesión      `--bloque`       #D3DEE9 azul
       Valoración  `--bloque-val`   #D3E4D3 verde
       Descarga    `--bloque-desc`  #E8DAF2 lavanda
       Libre       `--hueco`        papel · el único sin color
   O sea que Ali lleva desde agosto con bloques MACIZOS de color para estas
   mismas categorías, en la Agenda. La píldora no necesitaba una paleta:
   necesitaba dejar de inventarse una y usar el color del bloque de la cosa que
   nombra. Con eso, una valoración es el mismo verde en la Agenda, en Servicios
   y en Pacientes: un color, un significado, tres pantallas.
   ⚠️ ESTAS FICHAS NO TRAEN NI UN HEX NUEVO: apuntan a las que ya existen, y
   están aquí para que se vea de un golpe de dónde sale cada relleno.
   ⚠️ `Programa` es la excepción y lleva `--mando`, porque es lo único de esa
   pantalla que NUNCA aparece en un día («no se agendan: las sesiones de dentro
   sí»). Se marca por PESO, no pidiendo un quinto tono.
   ⚠️ Check-in se queda en el neutro: no está en la tabla de la Agenda, y
   `--bloque-ido` significa «no llegó», que es otra cosa. */
--pil-ses: var(--bloque);        --pil-ses-tinta: var(--bloque-dm-tinta);
--pil-val: var(--bloque-val);    --pil-val-tinta: var(--bloque-val-tinta);
--pil-anad: var(--bloque-desc);  --pil-anad-tinta: var(--bloque-desc-tinta);
/* ⚠️ `Programa` DEJA DE SER `--mando` (Joe, 2026-09-16: *"different colour that
   fits well for programa"*). El teal macizo era el mismo del botón primario de
   la barra, y en la tabla única de Servicios cuatro píldoras seguidas en el
   color del mando pesaban como cuatro botones. Lleva el violeta de la familia
   de programas (`--prog-c`, el mismo que ya viste un programa en Pacientes),
   que rima con el lavanda de `la sesión` a su lado y no se confunde con la
   valoración (verde) ni con la sesión (azul). Sigue sin ser un tono nuevo. */
--pil-prog: var(--prog-c);       --pil-prog-tinta: var(--prog-c-tinta);

/* ⚠️ LA PROMOCIÓN VA EN ÁMBAR, Y NO EN CORAL NI EN VERDE (Joe, 2026-09-14).
   · Coral queda descartado por la §1.2 de `LENGUAJE-ali.md`: significa «alguien
     te espera» y es el único acento de la casa que TIENE que poder llegar a
     cero —«una pantalla sin coral significa que nadie te necesita»—. Una
     promoción dura semanas, así que en coral esa lectura se muere.
   · Verde es lo más correcto por significado (`dinero por vender`), pero es la
     píldora de `Valoración` dos columnas más allá, y dos verdes en el mismo
     renglón no se leen como dos cosas distintas. Joe: *"the promotion pill
     should be a different colour"*.
   · Ámbar ya significa «falta algo, pero no de ti», que es lo más cerca que
     tiene la casa de «esto se acaba». Y es lo único del renglón que no es una
     categoría, así que un cuarto tono ahí no compite con nada.
   Relleno al mismo VALOR que los bloques de la Agenda (L 0,901 · C 0,028 en
   OKLCH), para que entre en la familia en vez de gritar. */
--promo-fondo: #473A29;   --promo-tinta: #F9F0E5;   /* 9,78 */

--pest-viva-fondo: transparent;
/* ⚠️⚠️ LA PÍLDORA DE TIPO ES MACIZA DESDE EL 2026-09-14 (Joe: *"what about solid
   pills for the programs or session type"*). Antes era de filete, y la regla
   escrita decía que un chip macizo se lee como un ESTADO.
   LO QUE CAMBIA LA REGLA ES QUÉ HAY DENTRO DEL CHIP, y son dos cosas distintas
   que se estaban confundiendo:
     · `.pac-pg` (Pacientes) lleva el NOMBRE de un programa. Ahí el color es
       pigmento, no significado: `--prog-b` es el ámbar de «falta algo» usado
       sólo como tinta. Macizo se leería como «este programa va mal». SIGUE DE
       FILETE, y su candado también.
     · `.srv-pill` (Servicios) lleva la CATEGORÍA de la fila: Programa, Sesión,
       Valoración, Check-in. Eso sí es una etiqueta, y una etiqueta maciza se
       escanea de un vistazo en una columna de veinte renglones. Ésta es la que
       se rellena.
   Relleno y tinta van en fichas emparejadas porque el contraste se mide entre
   las DOS: una tinta sola no dice si se lee. Medido sobre la tarjeta de cada
   tema, piso de la casa 7 a 1. */
--pildora-fondo: #23312F;        --pildora-tinta: #D3D6D6;   /* 9,31 */
--pildora-viva-fondo: #1B3733;   --pildora-viva-tinta: #5FD8C6;   /* 7,39 */
--pildora-ojo-fondo: #2B3126;    --pildora-ojo-tinta: #EBB870;    /* 7,39 · más
   claro que `--falta-algo` (#E0A85C daba 6,31 sobre su propio relleno): una
   tinta que vale sobre la tarjeta no vale sobre un relleno teñido. */

--pildora-raya: rgba(255,255,255,.15);   /* lo de siempre: sesión */
/* LA PASTILLA DE SEDE (Coyoacán · Mérida · Ver retirados). De noche el campo y
   la superficie ya son dos grises distintos, así que elegida y sin elegir se
   separan solas. En luz los dos son #FFFFFF y no se separaba nada: ver allí. */
--pest-fondo: var(--campo);
--pest-fondo-on: var(--superficie);
--pest-raya-on: rgba(95,216,198,.4);
--pildora-ojo: rgba(240,180,76,.42);     /* mírame: valoración */
--pildora-viva: rgba(95,216,198,.42);    /* otra cosa: check-in, programa */

--falta-borde:rgba(240,180,76,.35);
--falta-fondo:rgba(240,180,76,.08);

/* LAS TRES FAMILIAS, TRES TRABAJOS (documento, 2.1).
   ⚠️ Si el botón y el mensaje van en la misma familia, el botón deja de parecer
   un mando y parece una frase con borde. Esa es la diferencia entera entre esta
   app y el clásico: allí Libre Franklin se usa 105 veces y aquí se usaba 5. */
--f-cromo: Inter,-apple-system,BlinkMacSystemFont,'Helvetica Neue',Arial,sans-serif; /* titulares, botones, chips, pestañas, menú */
--f-cuerpo: Inter,-apple-system,BlinkMacSystemFont,'Helvetica Neue',Arial,sans-serif; /* mensajes, frases, explicaciones */
--f-mono: 'Roboto Mono',ui-monospace,'SF Mono',Menlo,monospace;               /* antetítulos, números, días y horas */
/* ⚠️ LA CUARTA ES SÓLO DEL LOGO, Y NO SE USA PARA NADA MÁS (2026-08-20).
   `ali.` se escribe en Fredoka en los cuatro sitios donde aparece: la portada
   (`web-ali-home/index.html`), las páginas que dibuja el servidor
   (`server/lib/aliStyles.js`), el clásico y la puerta. Entra como ficha porque
   se me acababa de escapar: al mudar la puerta a su hoja propia escribí el
   logo con `--f-cromo` (Libre Franklin) copiando la maqueta, y Fredoka no
   estaba ni en el `<link>`. No falla nada: el logo simplemente deja de ser el
   logo. Joe lo vio en un segundo.
   ⚠️ Que tenga nombre de ficha NO la abre a titulares: para eso está
   `--f-cromo`. Ésta es la marca y nada más. */
--f-marca: Inter,-apple-system,BlinkMacSystemFont,'Helvetica Neue',Arial,sans-serif;        /* SÓLO el logotipo `ali.` */

/* LA ESCALA. Cinco tamaños y dos pesos, y ni uno más (documento, 2.2 y 2.3).
   La dispersión es la mitad de cómo se llegó a 17 usos de 9px: un menú de cinco
   no deja sitio para inventar. Dos excepciones, las dos acordadas con Joe:
   `--t-nombre` (el nombre en el renglón de Chats) y `--t-mono` (antetítulos,
   horas y días, que el documento fija en 11px en sus secciones 4.2 y 4.3). */
--t-titular:17px;    /* titular de pantalla, nombre en el chat abierto */
--t-nombre:15.5px;   /* nombre en una tarjeta. Lo que se busca con el ojo */
--t-cuerpo:13.5px;   /* el mensaje, el porqué, la frase de un vacío */
--t-apoyo:12px;      /* contadores y rótulos de apoyo */
--t-barra:10px;      /* SÓLO la barra de abajo del teléfono */
--t-renglon:14px;    /* excepción 1: el nombre en el renglón de Chats */
--t-mono:11px;       /* excepción 2: antetítulos, horas y días, en mono */
--p-medio: 550;
--p-fuerte: 600;

/* EL AIRE ENTRE COLUMNAS DE UNA REJILLA (documento, sección 3). Es lo que
   separa un día del siguiente en la agenda, en vez de una raya. El lenguaje ya
   lo dice para las secciones ("lo que separa es la raya y el aire"); esto es el
   mismo principio aplicado a lo que va en paralelo y no en vertical.
   Sale del clásico, que usa `gap:8px` en `.ag-dias` (`styles.css:3314`). */
--aire-columna:8px;

/* EL CARRIL DE HORAS de la agenda en escritorio: el hueco a cada lado de la
   rejilla donde vive la hora, para que no se pinte encima de las citas.
   En el teléfono no existe (se come media columna de día) y la hora vuelve a ir
   flotando dentro. */
--carril-horas:46px;

/* LA SANGRÍA DE UN CAMPO. Lo que un campo de texto mete su contenido hacia
   dentro: su borde más su relleno. Existe como token porque hay DOS sitios que
   tienen que dar el mismo número (el relleno del buscador y la sangría del
   título que va encima), y dos números escritos a mano que tienen que coincidir
   es exactamente el fallo que Joe vio esta noche: coincidían por suerte y se
   separaron en cuanto se tocó uno. (Joe, 2026-08-09: "chats should be aligned
   with the search bar".) */
--sangria-campo:15px;

/* EL MARGEN LATERAL. Uno solo, y para todo (documento, sección 3).
   ⚠️ Va en las PIEZAS, no en la columna que las contiene: así el fondo de un
   renglón llega de borde a borde (que es como se lee una lista) y su contenido
   sigue cayendo en la misma línea que el título y que los rótulos de sección. */
--margen:16px}

html[data-tema="olivo"]{
  /* SUPERFICIES. Verde oliva claro, y CÁLIDO: medido a* -3.4 · b* +7.5.
     ⚠️ NO es `#EDF3F2` (a* -3.2 · b* +1.6), que es un gris con verde dentro:
     ése es el error de `#EAF1EC` que prohíbe la sección 1.1, en clave clara.
     Lo que separa al olivo de la menta es el amarillo, y se mide. */
  /* ═══════════════════════════════════════════════════════════════════════
     EL SUELO DEJA DE SER BLANCO (Joe, 2026-08-28)
     ═══════════════════════════════════════════════════════════════════════
     Joe: *"i like the green"*, sobre la maqueta con el suelo teñido.

     ⚠️ EL DEFECTO QUE ARREGLA ESTÁ MEDIDO, y era el motivo de que el tema de
     día se viera plano: la tarjeta (`#FDFDFB`) y la página (`#F6F6F2`) daban
     **1,03 a 1**. O sea que las tarjetas no se levantaban del papel, se
     DIBUJABAN encima. Con el suelo en `#E9EDE5` dan **1,17 a 1** sin tocar la
     tarjeta: se levantan, y por eso la tarjeta se queda en `#FDFDFB`.

     ⚠️⚠️ Y ESTO OBLIGÓ A REMEDIR TODO LO QUE ESTABA CALCULADO CONTRA BLANCO,
     que es el coste entero del cambio y no se puede saltar. Bajar el suelo baja
     el contraste de TODO lo que va encima. Lo que se movió y por qué:

       `--rotulo`         `#0F5C55` daba 6,57 sobre el suelo nuevo, por debajo
                          del piso de 7. A `#0C4F49` da **7,90**. Y como
                          `--mando` apunta aquí, esto es también el relleno de
                          todos los mandos de la app.
       `--necesita-tinta` `#BC4A2A` caía a 4,24, por debajo de 4,5. A `#AC3F21`
                          da **5,05**.
       `--falta-algo`     `#6B4700` caía a 6,98, justo por debajo de 7. A
                          `#614000` da **7,87**.
       `--raya`           perdía peldaño (1,59). A `#B0B4A5` vuelve a **1,72**.

     Y los neutros de la casa se tiñen con el suelo, porque un gris cálido sobre
     un papel verde se lee como suciedad: `--raya-lista`, `--globo-mio`,
     `--indice`, `--ix-raya`, `--ix-avatar`, `--avatar`, `--ix-elegido`,
     `--elegido-hondo` y los dos `--bloque-ido`. Misma transformación en todos
     (-13 en rojo, -9 en verde, -13 en azul), que es exactamente la que lleva
     `#F6F6F2` a `#E9EDE5`.

     ⚠️ LO QUE **NO** SE MUEVE: `--tarjeta`, `--campo`, `--superficie`,
     `--hueco` y `--hoja` siguen en `#FDFDFB`. Son lo que tiene que levantarse
     del suelo, y son la razón de que esto funcione. Quien las tiña, deshace el
     cambio entero.

     ⚠️ La tinta (`--tinta`, 13,62) y `--apagado` (7,48) siguen holgados. Se
     comprobaron; no hacía falta moverlos. */
  /* ═══════════════════════════════════════════════════════════════════════
     EL SUELO BAJA OTRO PELDAÑO (Joe, 2026-09-14)
     ═══════════════════════════════════════════════════════════════════════
     Joe, viendo el papel de una maqueta: *"the off whitey colour in the mock
     up, use that for the bg in the light theme"*.

     ⚠️ Y ES EL MISMO ARREGLO QUE ESTÁ CONTADO JUSTO ARRIBA, que se había
     deshecho. Esa nota dice que el suelo bajó a `#E9EDE5` para que la tarjeta
     se levantara, y avisa: «quien las tiña, deshace el cambio entero». El
     suelo volvió a subir a `#F4F3EF`, que es EXACTAMENTE `--hoja`, así que el
     panel y el papel eran el mismo color y la tarjeta daba 1,11.

     MEDIDO HOY, no elegido a ojo:
       tarjeta `#FFFFFF` sobre el suelo   1,11  →  **1,24**
       hoja    `#F4F3EF` sobre el suelo   1,00  →  **1,12**   (era invisible)
     O sea que ahora hay TRES planos y antes había dos: papel, panel, tarjeta.

     ⚠️ SE REMIDIÓ TODO LO QUE VA DIRECTAMENTE SOBRE EL SUELO, que es la regla
     que impone la nota de arriba y el único coste del cambio:
       `--tinta`       14,98 → **13,43**
       `--apagado`      8,03 →  **7,20**   (sigue por encima del piso de 7)
       `--rotulo`       8,48 →  **7,60**
       `--falta-algo`   8,44 →  **7,57**
     Ninguna baja del piso, así que no se mueve ninguna ficha de tinta.

     ⚠️ `--est-bien` (5,12) y `--est-falta` (3,38) se quedan como están A
     PROPÓSITO: no son texto, son el ESTADO DE UNA CIFRA, y viven en cifras
     grandes dentro de un panel (`--hoja`), donde siguen dando 5,71 y 3,77.
     Sobre el suelo desnudo no se usa ninguna de las dos.

     ⚠️ Y `--hoja` NO SE TOCA. Es lo que tiene que levantarse. */
  --lienzo: #E8E7E2;
  /* ⚠️ EL RIEL NO CAMBIA, y es la única ficha común a los dos temas: es la que
     dice que sigue siendo Ali (Joe, 2026-08-12: "i like the night rail"). */
  --cromo: #12201F;
  --tarjeta: #FFFFFF;
  --campo: #FFFFFF;      /* igual que la tarjeta, como de noche: los separa la raya */
  --superficie: #FFFFFF;
  /* ⚠️ .16 y no .10: una raya al 10% sobre papel es papel. De noche la raya es
     blanca al 10% sobre casi negro, que sí se ve. Mismo problema que `--apagado`
     con otra cara: el alfa no se traduce. Aquí decide si los paneles tienen
     borde o flotan. */
  --raya: #C2C5B8;       /* 1,75:1 sobre el papel (era #BDBDB2 · 1,75 contra el
                           suelo blanco viejo; sobre el teñido caía a 1,59). La raya invierte su relación
                           con sus vecinas: de día es MÁS oscura. Subida un
                           peldaño el 2026-08-28 con la de noche, ver allí. */

  /* TINTA. Sigue siendo cálida: a* +0.1 · b* +9.0, o sea cumple a* >= 0 y b* >= +5 */
  /* ══════════════════════════════════════════════════════════════════════
     ⚠️⚠️ POR QUÉ EL TEMA CLARO SE VEÍA FLOJO, Y CÓMO SE ARREGLÓ
     ══════════════════════════════════════════════════════════════════════
     Joe, 2026-09-14: *"colours are off, weak, sucursales pills look bad with
     white, price colour is bad, program or sesion pill colours are weak,
     contrast is all off"*.

     LA CAUSA ESTÁ EN EL DIFF, no en una opinión: el commit `3a34129`
     («Tema: se queda de noche siempre») reescribió las dos paletas de hex a
     alfa Y ACLARÓ TODOS LOS COLORES MEDIDOS, dejando en su sitio los
     comentarios que citaban los valores viejos. O sea que cada número escrito
     en este bloque describía un color que ya no estaba en el archivo:

        ficha          decía        tenía              medido de verdad
        --rotulo       «7,90»       #0F6F66 (era #0C4F49)      5,43
        --mando        (=rotulo)    #12857B                    4,05
        --falta-algo   «7,87»       #A9701A (era #614000)      3,77
        --apagado      —            rgba(22,32,30,.56)         3,77
        --tinta        —            rgba(22,32,30,.92)        12,07

     Esas cinco fichas pintan casi todo lo que Joe señaló: los rótulos, el
     relleno de los mandos, la letra de las píldoras, los pies de panel y el
     precio. Una sola causa, cinco síntomas.

     ⚠️ Y LA LECCIÓN DE FONDO: EL ALFA NO SE TRADUCE ENTRE TEMAS. Sobre casi
     negro, un blanco al 62% ya está casi encendido (7,15); sobre papel, un
     negro al 56% está a medio camino de nada (3,77). Peor: un alfa cambia de
     valor según lo que tenga detrás, así que la MISMA ficha daba un contraste
     sobre el lienzo y otro sobre la tarjeta. Por eso el tema claro vuelve a
     HEX OPACOS, que es como estaba medido. Quien vuelva a poner un rgba() aquí
     reabre este bug.

     Medido hoy contra `--lienzo` #F4F3EF y la tarjeta #FFFFFF, y contra su
     gemela de noche para que pesen igual:
        --tinta      #221E12   14,98 / 16,63   (de noche 14,91)
        --apagado    #494B3C    8,03 /  8,92   (de noche  7,15)
        --rotulo     #0C4F49    8,48 /  9,42
        --falta-algo #614000    8,44 /  9,37
        blanco sobre el mando                     9,42
     El piso de la casa son 7 a 1, y ahora lo pasa todo. */
  --tinta: #221E12;
  /* ⚠️ `--apagado` BAJÓ DE #5E6150 A #494B3C EL 2026-08-12 (5.46 → 7.65), y con
     él la miel y el verde de texto. Joe, viendo la pantalla de perfil: "the text
     now is too light on the lighter bg". Pasar AA no bastaba: sobre papel un
     secundario a 5.4 se lee como algo desactivado, y esta app tiene renglones
     enteros (rótulos, unidades, pistas) en ese tono. El carácter no cambia,
     sigue siendo el mismo olivo cálido (a* -3.9 · b* +8.7); cambia el valor. */
  /* ⚠️⚠️ .78 Y NO .56, Y ÉSTA ES LA FICHA QUE HACÍA QUE EL TEMA CLARO SE VIERA
     «FLOJO» (Joe, 2026-09-14: *"colours are off, weak... contrast is all off"*).
     MEDIDO sobre la captura, no opinado:
        de noche  `rgba(255,255,255,.62)` sobre el lienzo  →  7,45:1
        en luz    `rgba(22,32,30,.56)`    sobre el papel   →  3,77:1
     El mismo «56%» que en oscuro se lee fuerte, en papel se lee gris muerto:
     EL ALFA NO SE TRADUCE ENTRE TEMAS. Sobre negro, un blanco al 62% ya está
     casi encendido; sobre papel, un negro al 56% está a medio camino de nada.
     Con .78 sale 7,68 sobre el lienzo y 8,15 sobre la hoja, o sea el mismo
     peso que tiene de noche.
     ⚠️ Esta ficha pinta CASI TODOS los rótulos de la app —`sesiones`,
     `la sesión`, `próxima`, `dura`, los pies de panel—, así que era una sola
     línea haciendo que veinte cosas parecieran desteñidas a la vez. */
  --apagado: #494B3C;

  /* SIGNIFICADO. El coral casi no se mueve, y eso es la propuesta entera. */
  --rotulo: #0C4F49;                /* 8,48 sobre el suelo teñido. Era #0F5C55
                                      (7,23 contra el blanco viejo, 6,57 contra
                                      éste). Ver la nota de `--lienzo`. */
  /* ⚠️ EN EL DÍA EL MANDO ES OSCURO Y LA TINTA DE ENCIMA ES CLARA, o sea justo
     al revés que de noche. Por eso son tres fichas y no una: quien pinte un
     mando escribe `--mando` y `--sobre-mando` y no tiene que saber en qué tema
     está. Ver la nota larga del `:root`. */
  --mando: var(--rotulo);
  --mando-hondo: #093F3A;         /* 11,77 · el pulsado */
  --sobre-mando: #FFFFFF;
  --necesita-persona: #A94A32;
  --necesita-hondo: #8B3A26;
  --necesita-borde:#EFC9BA;
  --necesita-fondo:#FAE8E0;
  /* ⚠️ EN EL DÍA LA TINTA SOBRE EL CORAL ES BLANCA (Joe, 2026-09-17, con las pastillas
     «Sin contestar» delante: *"make text white or readable / better contrast on this pill
     colour"*). Era #26150D: 3,11 sobre #A94A32, por debajo del 4,5. Blanco da 5,66. De
     noche no cambia: allí el coral es claro y la tinta oscura es la que se lee. */
  --sobre-coral:#FFFFFF;
  --falta-algo: #614000;          /* 8,44 sobre el suelo teñido. Era #6B4700
                                    (7,13 contra el blanco, 6,98 contra éste). */
  --por-vender: #5F8C36;          /* se queda: es relleno y punto, no texto */
  --por-vender-suave: #6E9B3F;    /* 7.02 · el verde que SÍ es texto */
  --bien-tinta:#116349;          /* 6.20 */
  --falta-tinta:var(--falta-algo);
  --mal-tinta:#9E3A1E;           /* 5.85 */
  --necesita-tinta:#AC3F21;      /* 5,05 sobre el suelo teñido. Era #BC4A2A
                                    (4,97 contra el blanco, 4,24 contra éste,
                                    o sea por debajo de 4,5). */
  /* LA ETAPA, sobre papel. El único color de verdad nuevo de toda la entrega es
     `#294C68`: de noche el azul de una consulta es `#7FA8C9`, y ese azul sobre
     la hoja del índice se queda en 1.96:1, o sea que desaparece. */
  --etapa-consulta:#294C68;        /* 7.02 sobre el lienzo · 6.61 sobre su pastilla */
  --etapa-consulta-fondo:var(--bloque-dm);   /* #D3DEE9, ya existe en el tema */
  --etapa-consulta-marca:#294C68;
  --etapa-alta:var(--por-vender);            /* ya existe, y ya es relleno */
  --etapa-alta-tinta:var(--hoja);            /* 6.09 sobre el verde */
  --etapa-alta-marca:var(--por-vender-suave);
  --necesita-fondo-on:#F4DBCF;   /* el papel de Ali cuando está elegida · ΔE00 3.7 */
  /* (Aquí estaba el disco oscuro del tema claro, de cuando la lista era papel
     blanco. Con la columna de índice en su propia hoja el disco vuelve a ser
     claro con borde, y eso lo dicen las fichas `--ix-avatar*` de abajo.) */
  /* Un campo vacío se lee a 4.90 en vez de 2.9, y sigue tres escalones por
     debajo de un valor de verdad (15.29) y uno del rótulo (8.41). */
  --pista-opac:.8;
  /* Sobre papel el velo pesa MENOS: la hoja de debajo ya se lee clara, y con
     .72 la pantalla se apaga entera en vez de quedarse detrás. */
  --velo: rgba(22,32,30,.42);
  --sombra-capa:0 18px 48px rgba(37,32,20,.20);
  --falta-borde:rgba(107,71,0,.45);
  --falta-fondo:rgba(107,71,0,.07);
  /* ⚠️ `--necesita-suave` NO EXISTE EN ESTE TEMA. Era "coral claro para texto
     sobre oscuro", y aquí el coral no es texto: medido, `#C4552F` sobre el
     olivo da 3.84:1 y no pasa AA. Se le apunta a la tinta, que es lo que dice
     la tesis: si hace falta énfasis es peso y valor, no matiz. Donde marcaba un
     borde o un roce, un borde de tinta hace el mismo trabajo. */
  --necesita-suave: #C4674B;
  --porque:var(--tinta);
  --porque-peso:600;

  /* ESTADO DE UN DATO. Par más cercano entre ellos: CIEDE2000 21.2, piso 18.7 */
  --est-bien: #146B63;
  --est-falta: #A9701A;
  --est-mal: #A94A32;
  --est-neutro: #6B7876;
  /* ═══ HOY · las mismas fichas, de día (2026-09-15). Opacas y medidas contra
     `--hoja` #F4F3EF, no un alfa del tema de noche: el canal del turno al 5%
     de negro sobre papel es una mancha, y la barra en verde pálido con filo
     casi negro se lee como un CONTORNO vacío. De día la profundidad la da la
     tinta: canal macizo, barra sólida, sin filo. Ver la nota de noche. */
  /* ⚠️ LA SESIÓN NO ES BLANCA (Joe, 2026-09-15, viéndola): sobre papel crema una
     tarjeta blanca es un agujero, no una ficha. Va OLIVA CLARA, el verde de la
     casa bajado hasta donde no pesa. Y con la sesión teñida las otras dos
     familias ya no pueden separarse por claridad: se separan por TONO — oliva,
     gris neutro cálido, gris azul— con la misma claridad, que es lo que se lee
     de reojo sin comparar. */
  /* ⚠⚠ `HOY` Y LA AGENDA COMPARTEN PALETA (Joe, 2026-09-15): son la misma
     clínica el mismo día, y dos juegos de color para las mismas familias es cómo
     acaban siendo dos productos.
     ⚠⚠ EL REPARTO LO ELIGIÓ JOE VIÉNDOLO, y tiene una lógica que conviene no
     deshacer: lo que es TRATAMIENTO —sesión y descarga— comparte material, la
     misma oliva a dos profundidades (1,12 y 1,38 contra el lienzo). El CHECK-IN
     no es tratamiento, es un trámite, y por eso es el único que cambia de TONO:
     lavanda a 182° de la oliva y al mismo peso, con lo que se distingue sin
     pesar más. Y la valoración es lo único saturado de la pantalla.
     ⚠ EL `roce` DE LA SESIÓN NO PUEDE CAER ENCIMA DE LA DESCARGA (1,12 entre los
     dos): pasar el ratón por una sesión la dejaría con pinta de descarga. */
  /* ⚠ LA CARA VIVA NO ES BLANCA (Joe, 2026-09-15: *"the colours are wrong
     here"*). Sobre blanco la oliva se vuelve verde cuartel y la descarga deja de
     distinguirse de la sesión: los rellenos están MEDIDOS contra el lienzo, no
     contra el papel. La cara es el lienzo, un peldaño por debajo de la hoja, que
     es la misma relación que ya tienen los bloques en la Agenda. */
  --cara-fondo: #D8DDC8;
  --hueco-filo: #DEDCD5;            /* el hueco pierde el trazo discontinuo */
  --pista-canal: rgba(34,30,18,.13);  /* el cronógrafo de la hora viva */
  --pista-hecho: rgba(34,30,18,.34);
  --pu-raya: rgba(34,30,18,.10);      /* el pelo entre puestos de la banda */
  --tipo-ses-fondo: #D8DDC8;        /* OLIVA · 1,12 sobre el lienzo, = --bloque */
  --tipo-ses-tinta: #221E12;
  --tipo-ses-filo: transparent;
  /* ⚠⚠ LA DESCARGA TIENE SU PROPIO TONO (Joe, 2026-09-15, eligiéndolo sobre tres
     candidatos). Era la MISMA oliva que una sesión, un peldaño más honda, y por
     eso se le caía encima una y otra vez: una familia distinta no puede ser una
     versión más oscura de otra, porque en cuanto algo se interpone —el roce, la
     bandeja de la hora viva— las dos se juntan. Ahora hay cuatro familias y
     cuatro TONOS: oliva la sesión, arena la descarga, lavanda el check-in, teal
     la valoración. Ninguna puede confundirse con otra más clara o más oscura.
     ⚠ Barro y acero se descartaron mirándolos: el barro tiraba al coral que
     significa AHORA, y el acero se acercaba demasiado a la lavanda. */
  --tipo-des-fondo: #E2C7A8;        /* ARENA · 1,46 sobre la hoja, tono 71 */
  --tipo-des-tinta: #221E12;
  --tipo-chk-fondo: #DDD5EE;        /* LAVANDA: el único que cambia de tono · 1,14 */
  --tipo-chk-tinta: #221E12;
  --tipo-val-fondo: #006654;        /* 5,6 sobre el lienzo: la única saturada */
  --tipo-val-tinta: #FFFFFF;
  --ahora: #8C3220;                 /* MEDIDO 7,3 sobre la hoja · 8,1 sobre la superficie: TINTA de 11px */
  --ahora-viva: #E05439;            /* 3,4 sobre la hoja: sólo punto y trazo, nunca texto */
  --turno-canal: #EAE8E0;           /* un tono más oscuro que la ficha */
  --turno-lleno: #36726A;           /* barra sólida, la tinta de la casa */
  --turno-borde: #36726A;           /* = relleno: sin filo, a propósito */
  --turno-raya: #C2C5B8;            /* el turno que aún no empieza, discontinuo */
  --espina: #83877A;                /* 3,3 sobre la hoja: una recta, no texto */
  /* El verde de "esto está pasando" sobre papel: al 12% y no al 14%, porque
     sobre el olivo un velo del 14% ya se lee como un bloque de color. */
  --bien-fondo:rgba(23,132,95,.12);
  --bien-borde:rgba(23,132,95,.32);

  /* EL DINERO, de día. `--debe` es la TINTA de "falta algo" (#6B4700, 7.13:1),
     no su punto (#A97600): la pastilla del saldo es texto de 11px y con el punto
     salía a 3.1:1. El fondo y el borde son los de la casa, ya afinados para
     papel: una miel al 8% de noche no existe sobre el Olivo. */
  --pagado:var(--bien-tinta);
  --pagado-punto:var(--est-bien);
  --pagado-fondo:rgba(23,132,95,.10);
  --pagado-borde:rgba(23,132,95,.32);
  --debe:var(--falta-tinta);
  --debe-fondo:var(--falta-fondo);
  --debe-borde:var(--falta-borde);
  --revertido:var(--est-neutro);

  /* VELOS Y ROCES. Sobre papel un velo blanco no existe: se tiñe con tinta. */
  --roce: rgba(22,32,30,.035);
  --marca-agua: #8A8D7C;   /* 3,40 sobre el campo blanco */
  --elegido: rgba(22,32,30,.055);
  /* ⚠️⚠️ LA RAYA DE LISTA ERA INVISIBLE EN PAPEL (Joe, 2026-09-14: *"border is
     all off"*, con `Mi día` de 30 citas delante). Decía "la raya blanca al 7% no
     se ve en papel" y acto seguido ponía NEGRO al 7%, que sobre el papel del
     panel (`--hoja` #F4F3EF) resuelve a #E4E4E0 y mide 1,15:1. Eso no es una
     raya suave: es nada. Y la usan 44 reglas de la app, así que 44 separadores
     estaban sin dibujar.
     Mismo error que esta mañana con las cinco fichas: UN ALFA NO SE TRADUCE
     ENTRE TEMAS, y encima cambia de valor según lo que tenga detrás (papel del
     lienzo, de la tarjeta o del panel). Va opaco y MEDIDO.
     #D3D6CA · 1,47 sobre blanco · 1,33 sobre `--hoja`. Por debajo de `--raya`
     (1,75), que es el borde del panel: una lista se separa más flojo que se
     enmarca. */
  --raya-lista: #D3D6CA;
  --globo-mio: #EDF3F1;        /* tinta sobre el lienzo (era "el mismo tono que un bloque", y dejó de serlo cuando la sesión se fue al azul) */

  /* ⚠️⚠️ EL PAPEL SE MUDÓ: DE LA REJILLA ENTERA AL HUECO (2026-08-17). Joe:
     *"make sure agenda bg is the same as other pages, and the libre citas are
     papel"*.
     ANULA la decisión del 2026-08-12 (*"make the bg of the agenda white"*), que
     ponía TODA la rejilla sobre papel y la dejaba como la única pantalla de la
     app con un fondo propio. Ahora la agenda se apoya en el mismo olivo que
     Pacientes, Caja, Marketing y el resto, y el papel es lo que rellena un sitio
     LIBRE.
     ⚠️ Y NO ES SÓLO MOVER UN COLOR, ES INVERTIR QUIÉN SE VE. Antes lo ocupado
     era tinta sobre una hoja blanca y lo libre era la hoja; ahora lo ocupado
     sigue siendo tinta (`--bloque`, más oscuro que el olivo) y **lo libre se
     levanta**, más claro que el fondo. Lo lleno y lo vacío se siguen
     distinguiendo sin pintar nada de color, que es lo que se buscaba entonces y
     lo que sigue mandando.
     ⚠️ #F8F9F0 Y NO #FFFFFF, que eso no cambia: es el mismo papel que una
     tarjeta, ya existente en el tema. Blanco puro contra el olivo sería un
     cuarto plano, y con tres ya se explica.
     De noche vale `transparent`, o sea que allí no se mueve nada. */
  --hueco:#FDFDFB;
  /* ⚠️ LA COLUMNA DE ÍNDICE ES UNA HOJA MÁS HONDA DEL MISMO PAPEL, y es LA
     decisión que la guía (`Ali/GUIA-build-tema-claro.md`, sección 0) dice que
     hay que confirmar antes de escribir CSS. Hay dos esquemas completos y sólo
     se diferencian en esto: `hojas` (lo que está aquí) deja el índice en papel
     hondo con el riel de noche; `olivo hondo` lo pone en una columna oscura
     (`#333720`) y baja el riel a `#1C1C0E`.
     Se construye `hojas` porque es el que trae la maqueta que Joe mandó: su
     riel es `#0A2220`, que es el de noche, y ése es el que distingue a los dos.
     Y porque no cuesta excepciones: en `olivo hondo` el coral vuelve a ser
     texto dentro de la columna y la lista necesita su propio juego de fichas
     repetido en tres pantallas.
     ⚠️ SI SE CAMBIA DE ESQUEMA, SE CAMBIA AQUÍ Y NADA MÁS. Por eso son fichas y
     no colores escritos en la regla. Comparativa: `ali-dos-esquemas-cuatro-pantallas.html`. */
  --hoja: #F4F3EF;
  --indice:#E3E7DF;
  --ix-raya:#D6DAD1;
  /* ⚠️ SOBRE LA HOJA DEL ÍNDICE EL DISCO VUELVE A SER CLARO, con su raya. Un
     disco oscuro tenía sentido cuando la lista era papel blanco y el disco era
     lo único que le daba cara; sobre `#E2E5CE`, que ya es una hoja aparte, el
     disco claro con borde es lo que dice la maqueta y lo que deja que la
     inicial se lea en tinta como el resto del renglón. */
  --ix-campo:var(--hoja);
  --ix-avatar:#D4D8CF;
  --ix-avatar-tinta:var(--tinta);
  --ix-avatar-borde:0;
  /* La fila elegida es un tono de la MISMA hoja, no un velo de tinta encima:
     un velo sobre `#E2E5CE` se ensucia, un tono se lee. */
  --ix-elegido:#DBDFD6;
  /* 18%: el peldaño más oscuro de la escalera medida en
     `Ali/Designs/ali-fila-abierta-2.html` donde el renglón de abajo todavía
     pasa. Con la tinta llena que esta app le pone al nombre Y al mensaje da
     8.84, mejor que el 4.86 que proponía la maqueta. */
  --elegido-hondo:#C8CCC2;
  /* Y el tinte de hoy es el MISMO en la cabecera y en la columna, para que
     corra entero de arriba abajo en vez de cortarse donde acaba el nombre. */
  --hoy-tinte-cab:var(--hoy-tinte);

  /* LA CABECERA de Agenda y de Chats, dentro del cromo. */
  /* La cabecera es papel, como todo lo que no es el riel. La ficha se queda
     porque es el interruptor: si alguna vez vuelve a haber una cabecera
     oscura, se cambia aquí y no en seis reglas. */
  /* ⚠️ Y SE APAGA (Joe, 2026-08-24: "make sure top dark teal bar is gone on all
     sections"). Aquí decía `var(--cromo)` desde el 2026-08-12 ("top header
     needes to be same dark teal"), y esta línea era la excepción entera a "el
     riel es lo único oscuro".

     Lo que la tumba no es el gusto: con las cinco secciones dibujando ya el
     MISMO armazón sobre papel, una cinta oscura arriba mete un segundo tono
     oscuro que sólo repite lo que el riel ya dice (dónde estás) y se come el
     alto donde va la primera línea de trabajo.

     ⚠️ EL INTERRUPTOR SE QUEDA, apagado. El día que vuelva a haber una cabecera
     oscura se enciende AQUÍ y no en seis reglas. Lo que sí se fue con esto son
     los reatados de `.sup-h` a tonos del riel en `conversar.html`: sobre papel
     pintaban crema sobre crema. */
  --cab-fondo:transparent;
  
  /* LA AGENDA. Un bloque deja de ser LUZ sobre el lienzo y pasa a ser TINTA
     sobre él, o sea más oscuro que el fondo. Y "no llegó" invierte su
     mecanismo: de noche se hunde, en papel se desvanece HACIA el papel. */
  /* Una SESIÓN es azul desde el 2026-08-19. Ver la nota larga del `:root`:
     comparte valor con `--bloque-dm` y NO es la misma ficha. */
  /* ⚠⚠ LA REJILLA VA LAVANDA (Joe, 2026-09-15, eligiéndolo sobre la maqueta).
     Lo que había era un azul frío (tono 248°) sobre papel crema (tono 97°): 151°
     de distancia, que es exactamente lo que hace que una agenda parezca la de
     cualquier app de calendario. Ahora las familias son UN SOLO material a tres
     profundidades —cita 1,14 · descarga 1,41 contra el lienzo, mismo tono 300°—
     y la valoración es lo ÚNICO saturado de la pantalla: maciza, tinta al revés.
     ⚠ Y EL `roce` DE LA CITA NO PUEDE CARSE ENCIMA DE LA DESCARGA: pasar el ratón
     por una sesión la dejaría con pinta de descarga. 1,13 entre los dos, medido.
     ⚠ QUIEN NO LLEGÓ SE HUNDE, NO BRILLA: `--bloque-ido` era #E6EAE3, MÁS CLARO
     que el propio lienzo, así que una falta era el bloque más luminoso del día.
     Ahora va por debajo. */
  --bloque:#D8DDC8;
  --bloque-roce:#CED4BC;
  /* ⚠️ LA SEGUNDA LÍNEA DE UN BLOQUE YA NO PUEDE SER `--apagado`, y esto lo
     destapó el azul. Sobre el gris de antes daba 7.38 y pasaba; sobre el azul
     cae a 6.54, por debajo del piso de 7 que esta casa se puso el 2026-08-12
     después de que Joe dijera *"the text now is too light on the lighter bg"*.
     Y no era sólo el azul: sobre el verde de una valoración lleva desde
     entonces en 6.71, sólo que nadie lo miraba porque la prueba comprobaba
     `--bloque` y no `--bloque-val`. Al volverse azul la sesión, ese fallo
     pasaba de raro a ser la mayoría de la agenda.
     `#424435` es el MISMO tono un peldaño más abajo (ΔE00 2.3 contra
     `--apagado`, a* -3.92 · b* +8.83 contra a* -3.87 · b* +8.69), así que no
     cambia el carácter: cambia el valor. Pasa en las tres, 7.30 · 7.46 · 7.49.
     ⚠️ Con el ratón encima cae a 6.65-6.92 y se acepta: es un estado que dura
     lo que dura el puntero, no algo que se esté leyendo. */
  --bloque-meta:#4F4A5C;
  --bloque-val:#006654;
  --bloque-val-roce:#005746;
  --bloque-val-tinta:#FFFFFF;
  --bloque-val-meta:rgba(255,255,255,.78);
  --bloque-dm:#D8DDC8;
  --bloque-dm-roce:#CED4BC;
  --bloque-dm-tinta:var(--tinta);
  --bloque-dm-meta:var(--bloque-meta);
  /* La descarga muscular, en lavanda. L* 88.8 · C* 13.5 · hue 312, o sea la
     misma banda de luz que sus dos vecinas y una pizca más de croma que el
     verde (10.8). La tinta se lee a 12.15 encima. */
  --bloque-desc:#E2C7A8;
  --bloque-desc-roce:#D9B993;
  --bloque-desc-tinta:var(--tinta);
  --bloque-desc-meta:var(--bloque-meta);
  --bloque-ido:#E0DEE4;
  --bloque-ido-roce:#DAD8DE;
  --bloque-ido-tinta:#8B8794;
  --rejilla: rgba(22,32,30,.09);
  --comida-trama:rgba(37,32,20,.075);
  --cerrado-trama:rgba(37,32,20,.05);
  --hoy-tinte:rgba(218,101,68,.075);
  --hoy-borde:rgba(218,101,68,.42);
  --hoy-tinte-cab:rgba(218,101,68,.10);

  /* ⚠️ LA SOMBRA DE UNA HOJA, ficha nueva del 2026-08-19 (lenguaje 1.4e).
     `--sombra-capa` levanta una CAPA entera sobre la pantalla; ésta levanta una
     HOJA un peldaño sobre su página, y es el sustituto directo de un borde.
     Si escribes un `border` alrededor de una superficie ENTERA, te falta ésta.
     De noche vale `none`: sobre teal una sombra no existe. */
  --sombra-hoja:0 1px 2px rgba(37,32,20,.05), 0 8px 24px rgba(37,32,20,.07);
  /* ⚠️ EL DISCO DE UNA PERSONA, y ESTA FICHA NO ESTABA (fallo vivo hasta hoy).
     `LENGUAJE-ali.md` publicaba `--avatar:var(--cromo)` y era FALSO: al no
     estar aquí heredaba el `:root` de NOCHE, `#17393E`, o sea que los discos de
     `dia.css` (.eld-r .ini, .eld-abierta .cabr .ini, .lu-ic) salían de día en un
     teal que no es de ningún tema claro.
     Se resuelve hacia RELLENO CLARO SIN ANILLO en toda la app, que es lo que
     hace `--ix-avatar` aquí abajo: con la raya nueva (C* 2.6) un anillo ya no se
     ve, y un disco claro deja el disco CORAL de Ali como el único disco de
     color de la pantalla, que es lo que el coral significa. */
  /* ⚠️ L*89.5 Y NO L*92.9, y el motivo se vio en pantalla, no en la hoja de
     cálculo. A #EBEBE6 el disco daba ΔE 1.85 contra `--indice` y DESAPARECÍA
     en Chats y en Pacientes, que es justo donde más se usa. Contra `--hoja`
     se veía bien, y por eso el fallo se cuela si sólo miras El día.
     A #E1E1DC da ΔE 5.32 contra el índice y 9.98 contra la hoja, o sea que es
     un objeto en las dos, y la inicial sigue en tinta a 12.36:1. */
  --avatar: #E4EEEB;
  --avatar-tinta: #0F4A44;
  /* Y en la fila viva el disco NO se oscurece: ver la nota del `:root`. */
  --avatar-viva:var(--avatar);
  --avatar-viva-tinta:var(--avatar-tinta);
  --avatar-viva-borde:0;

  /* Los seis del programa, en su versión de día: mismo orden, mismo sitio, y
     todos por encima de 4,5 sobre el suelo teñido porque aquí son TEXTO. */
  /* ⚠️⚠️ EN LUZ LA PÍLDORA SE RELLENA; DE NOCHE VA DE FILETE. No es capricho:
     de noche un filete claro sobre casi negro ya es un objeto —el ojo lo ve
     flotar—, pero sobre papel un filete al 20% es una sombra de algo. Joe:
     *"program or sesion pill colours are weak"*.
     El relleno es un velo del 8-10% del MISMO tono que la letra, así que la
     píldora sigue diciendo lo mismo (teal = programa, ámbar = valoración) y
     pasa de sugerida a dibujada. La letra se queda en el tono fuerte, que ya
     mide por encima de 7 sobre ese velo. */
  --pest-viva-fondo: #E7F3F2;   /* el relleno de la pastilla de sede elegida */
  /* ⚠️⚠️ `--sigue-*` NO EXISTÍA EN EL TEMA CLARO (2026-09-14). Las tres fichas
     estaban sólo en `:root`, o sea sólo de noche, así que en papel caían al
     valor de noche: el verde menta al 10% sobre blanco es casi blanco, y lo que
     marca «esto es lo siguiente» —la caja de la escalera, la fila de la hora
     que viene— no se veía.
     Es el mismo fallo que las cinco fichas de esta misma mañana y el mismo de
     `--raya-lista`: UN ALFA NO SE TRADUCE ENTRE TEMAS. Aquí además el tinte es
     verde menta, que en el tema claro NO es el verde de la casa (`--rotulo` es
     #0C4F49, mucho más hondo): copiarlo habría metido un color que no existe en
     este tema. Opacos y medidos sobre el papel de la tarjeta (#FFFFFF). */
  --sigue-fondo: #E3F1EE;        /* 1,13 sobre la tarjeta: un velo, no un bloque */
  --sigue-fondo-roce: #D5EAE6;   /* 1,22 */
  --sigue-borde: #9DC9C2;        /* 1,73, a la altura de `--raya` */
  /* Su meta, de día: la familia verde del alta, opaca y medida sobre la
     tarjeta. Ver la nota de noche. */
  --meta-fondo: #E6EFD9;
  --meta-borde: #B5CC9A;
  --meta-tinta: #2F5314;         /* 7,48 sobre #E6EFD9 */
  --promo-fondo: #EADCCB;   --promo-tinta: #553503;   /* 8,22 · ver la nota de noche */

  /* La píldora maciza en luz. Ver la nota larga de noche. Medido sobre la
     tarjeta blanca, que es donde vive: */
  --pildora-fondo: #EEEEEE;        --pildora-tinta: #3E4034;        /* 9,11 */
  --pildora-viva-fondo: #DFE8E7;   --pildora-viva-tinta: #0A423D;   /* 9,07 */
  --pildora-ojo-fondo: #EAE6DE;    --pildora-ojo-tinta: #543800;    /* 8,70 */


  /* ⚠️ `--calculado` NO TENÍA VALOR DE DÍA y heredaba el lavanda de noche:
     #9C8FDA sobre la tarjeta blanca son **2,86 a 1**, lo más flojo que había en
     la pantalla. Es la cifra de `la sesión` en Programas. Mismo lavanda, con el
     valor que le toca a este tema (8,10 sobre la tarjeta, 7,29 sobre el
     lienzo); es el mismo tono que `--prog-c`. */
  --calculado: #514396;
  --calculado-filo: #C4BFDB;
  /* ⚠️⚠️ LAS CUATRO FICHAS DE COBROS Y GASTOS, EN SU VALOR DE DÍA (2026-09-14).
     `--ali-lavanda` #8778CE sobre la tarjeta blanca daba 3,03:1, o sea un sello
     `ALI` que no se lee. Toma el MISMO valor que `--calculado`, que la casa ya
     midió para este tema (8,10 sobre la tarjeta, 7,29 sobre el lienzo): es el
     mismo tono, un peldaño más hondo. Su filo, el de `--calculado`.
     `--cab-tabla`: `--superficie` y `--tarjeta` son las dos #FFFFFF aquí, así
     que la tira de cabecera desaparecía. Va al tono del índice (#E3E7DF), que
     es «la misma hoja, un peldaño más honda» y ya está medido contra la tinta.
     `--hair`: OPACO Y MEDIDO, no un alfa (la regla de esta mañana: un alfa no se
     traduce entre temas y cambia según lo que tenga detrás). #E6E6E1 es lo que
     da rgba(34,30,18,.09) sobre blanco: 1,28 sobre la tarjeta, por debajo de
     `--raya-lista` (1,47), que es lo que toca a un filete entre renglones.
     `--cliniko-*`: los claros ya estaban en la casa con otro nombre. */
  --ali-lavanda: #514396;
  /* ⚠️ LAS TRES DE ALI QUE SÓLO EXISTÍAN DE NOCHE (2026-09-17, Interesados en
     luz: la pastilla «La lleva Ali» salía en lavanda pálido sobre lavanda
     pálido, ilegible). Octava vez de lo mismo: una ficha que sólo vive en
     `:root` hereda el valor de noche sobre papel. Valores de la maqueta
     `2026-09-16-chats-la-casa.html` (tema olivo): el lavanda hondo como tinta
     mide 8,10 sobre la tarjeta. */
  --ali-filo: #C4BFDB;
  --ali-fondo: rgba(81,67,150,.08);
  --ali-fondo-roce: rgba(81,67,150,.14);
  --ali-pie: #514396;
  --ali-filo: #C4BFDB;
  --cab-tabla: #E3E7DF;
  --hair: #E6E6E1;
  --cliniko-fondo: #E7F3F2;      /* = --pest-viva-fondo */
  --cliniko-filo: #9DC9C2;       /* = --sigue-borde, 1,73 */
  --cliniko-barra: #7FB3AC;

  /* ⚠️ LAS TRES PÍLDORAS DE SERVICIOS SÓLO EXISTÍAN EN NOCHE (2026-09-14). Su
     filete es blanco al 15%, que sobre papel es papel: la píldora `Sesión`
     desaparecía entera en el tema claro mientras `Valoración` y `Programa` se
     veían, porque ésas van en ámbar y en teal. Se ve al encender la luz y no
     antes, que es justo lo que pasa cuando un tema lleva meses apagado. */
  /* ⚠️ LA PASTILLA DE SEDE ERA BLANCA SOBRE BLANCA (Joe, 2026-09-14:
     *"sucursales pills look bad with white"*). `--campo` y `--superficie` valen
     los dos #FFFFFF en luz, o sea que «Coyoacán» elegida y «Mérida» sin elegir
     se pintaban EXACTAMENTE igual: la única diferencia era un filete de menta
     de noche al 40% sobre papel, que es papel (1,1:1). Sin relleno que las
     levante del lienzo, tampoco se veía que fueran pulsables.
     Ahora: sin elegir el lienzo se ve a través (la pastilla es sólo filete y
     letra, 8,03) y la elegida se rellena de teal claro con el filete del mando
     encima, y su letra sube a tinta (14,26 sobre ese relleno). */
  /* ⚠️⚠️ Y EL RELLENO ERA AZUL, QUE ES EL OTRO LADO DEL MISMO FALLO (Joe,
     2026-09-16: *"i hate the light blue"*, dos veces). `--pest-viva-fondo`
     (#E7F3F2) es un velo CIAN, y este tema es cálido: papel #F4F3EF, rayas
     oliva #C2C5B8, bloques #D8DDC8. Un tinte frío encima de una paleta cálida
     no se lee como «elegido», se lee como de otra pantalla.
     Y MEDIDO NO HACÍA SU TRABAJO: #E7F3F2 contra la hoja da 1,02, o sea nada.
     Sólo levantaba contra blanco (1,13), que era el caso del 14 de septiembre,
     pero las pestañas de página van sobre la hoja, no sobre la tarjeta.
     #E8EADE es el mismo gesto en el oliva de la casa y mide mejor por los dos
     lados: 1,10 sobre la hoja (cuatro veces el levante de antes) y 1,24 sobre
     blanco, así que la pastilla de sede del 14 de septiembre sigue arreglada.
     Tinta 13,7 encima; el mando 7,7, que es lo que lleva el contador. */
  --pest-fondo: transparent;
  --pest-fondo-on: #E8EADE;
  --pest-raya-on: var(--mando);

  --pildora-raya: #D0D2D2;
  --pildora-ojo: #CDC0A8;
  --pildora-viva: #AED6D2;

  /* ⚠️ LOS SEIS TINTES SE OSCURECIERON EL 2026-09-14 (Joe: *"program or sesion
     pill colours are weak"*). Iban de 4,18 a 6,96 sobre la tarjeta, o sea que
     NINGUNO llegaba al piso de la casa y el ámbar no llegaba ni a AA. Se bajó
     la luminosidad de cada uno conservando su tono, hasta 7,3 sobre el lienzo,
     que es el peor fondo donde caen. Ahora dan 8,1 sobre la tarjeta.
     ⚠️ Y los filetes pasan a hex: un alfa cambia de valor según lo que tenga
     detrás, que es el bug que abre este bloque. */
  /* Los tres primeros SON los de la Agenda; los otros tres se generaron al
     mismo valor (L 0,901 · C 0,028 en OKLCH, la media de esos tres) porque el
     sistema no tenía más tonos a esa altura. Tinta `--tinta` en los seis:
     12,2 a 12,5 sobre su relleno. */
  --prog-a: var(--bloque-val);  --prog-a-tinta: var(--tinta);   /* 12,52 */
  --prog-b: var(--bloque);      --prog-b-tinta: var(--tinta);   /* 12,19 */
  --prog-c: var(--bloque-desc); --prog-c-tinta: var(--tinta);   /* 12,47 */
  --prog-d: #F0D8D2;            --prog-d-tinta: var(--tinta);   /* 12,24 */
  --prog-e: #DDE1CC;            --prog-e-tinta: var(--tinta);   /* 12,45 */
  --prog-f: #EADCCB;            --prog-f-tinta: var(--tinta);   /* 12,36 */
}

/* ═══════════════════════════════════════════════════════════════════════════
 * LA FORMA (2026-09-10) · el mismo lenguaje que Inicio
 * ═══════════════════════════════════════════════════════════════════════════
 * Los colores ya vivían aquí; el RADIO y la SOMBRA no, y por eso estaban
 * escritos a pelo 433 y 98 veces dentro de `conversar.html`. Sin nombre no hay
 * sistema: cada pantalla elegía el suyo y salían catorce radios distintos.
 *
 * La escalera es la de Inicio y NO pasa de 12 px. Lo que hace que una app
 * parezca de juguete es el radio grande, no el color.
 *
 * ⚠️ LA PÍLDORA Y EL CÍRCULO NO SON RADIOS DE CAJA. `--r-pildora` (999px) y el
 * 50% de los avatares se quedan: una pastilla redonda es una forma, no una
 * esquina, y aplanarlas sería otra cosa distinta.
 */
:root{
  --r-min: 4px;
  --r-chico: 6px;
  /* ⚠️ EL RADIO CHICO, Y NACE DE UNA CUENTA (2026-09-13). La casa tenía cuatro
   esquinas y la hoja usaba 3px, 4px y 5px QUINCE veces sin ficha, porque una
   casilla de 17px con `--r-medio` (8) sale casi redonda: la escala no tenía un
   peldaño para lo pequeño y se inventaba uno cada vez. Uno solo, y los tres
   viejos caen aquí. */
--r-chico: 4px;
--r-medio: 8px;
  --r-caja: 10px;
  --r-panel: 12px;
  --r-pildora: 999px;

  /* CERO SOMBRAS. La profundidad se hace con luminancia y un filete de 1px.
     La única excepción es lo que FLOTA de verdad: el buscador de comandos, los
     emergentes y los diálogos. */
  --sombra: none;
  --sombra-capa: 0 12px 32px rgba(22,32,30,.16), 0 0 0 1px rgba(22,32,30,.07);
}
html[data-tema="noche"]{
  --sombra-capa: 0 16px 40px rgba(0,0,0,.46), 0 0 0 1px rgba(255,255,255,.08);
}

/* ⚠️ EL CROMO TAMBIÉN SIGUE LA HORA (2026-09-10). Las dos luces de arriba son
   FIJAS y por eso a las cuatro de la mañana el riel de la Agenda salía con un
   lavado marrón encima: el coral al 38% es la luz del amanecer, y puesto a
   medianoche es suciedad. Se quedan como valor por defecto (nadie sin `tema.js`
   pierde el cromo) y `data-luz` las reescribe, con la MISMA gramática que la
   portada: arriba a la derecha la luz de la hora, abajo a la izquierda el
   lavanda de Ali, que es quien no se apaga nunca.

   ⚠️ EL 38% DEL CORAL ESTABA MEDIDO Y ESTOS TAMBIÉN. Un resplandor aclara el
   suelo bajo el texto y eso es lo que se come el contraste; el suelo de la casa
   es 7. MEDIDO contra el píxel real de la cabecera de la Agenda, con la app
   corriendo y datos de verdad, ocultando el texto para fotografiar el fondo
   puro y componiendo cada alfa encima: el peor par de las CUATRO franjas es
   7,08 («2 sin confirmar», el coral) y el siguiente 7,10 (el blanco sobre el
   teal de `Agendar`). Quien toque un alfa vuelve a medir así —la app corriendo,
   el texto oculto para fotografiar el fondo, cada alfa compuesta encima— y no a
   ojo. */
html[data-luz="amanecer"]{
  --riel-brillo: rgba(232,138,106,.38);        /* el coral es, literalmente, el amanecer */
  --riel-brillo-menta: rgba(105,90,170,.20); }
html[data-luz="dia"]{
  --riel-brillo: rgba(95,216,198,.20);         /* la luz de la casa, alta y fría */
  --riel-brillo-menta: rgba(105,90,170,.15); }
html[data-luz="tarde"]{
  --riel-brillo: rgba(224,168,92,.24);         /* vuelve a caer, más ámbar que coral */
  --riel-brillo-menta: rgba(105,90,170,.18); }
html[data-luz="noche"]{
  --riel-brillo: rgba(60,120,140,.16);         /* casi nada arriba */
  --riel-brillo-menta: rgba(105,90,170,.26); } /* y Ali, que es quien sigue despierta */

/* ═══════════════════════════════════════════════════════════════════════════
   LA AURORA DE LA PUERTA (2026-09-11)
   ═══════════════════════════════════════════════════════════════════════════
   Joe eligió la puerta «C», calcada de la de Stripe: **una atmósfera enorme
   entrando por una esquina y un formulario sobrio encima**. De las seis puertas
   que fuimos a mirar (Linear, Vercel, Attio, Mercury, Stripe, Ramp) es la única
   que impresiona, y hace una sola cosa: color, tamaño y silencio.

   ⚠️ ESTÁ AQUÍ Y NO EN `entrada.css` POR LA REGLA DE SIEMPRE: esa hoja no puede
   escribir ni un color a mano, y lo vigila `test/entrada-puerta.test.js`. Un
   tema se deshace por goteo.

   ⚠️ Y SIGUE LA LUZ DE LA HORA, con la misma gramática que el cromo y que el
   hero de la portada: cuatro momentos, sólo fondo. **Ninguna de estas fichas
   toca texto ni estados** (§13.1 del lenguaje): la puerta se lee igual a las 6
   que a las 23.

   Los cuatro tonos son los de la casa, puestos como amanecer: el coral que
   significa «te necesitan», el ámbar de «esperando», el lavanda de Ali —que es
   quien no se apaga nunca— y el teal de la marca abajo del todo. */
html[data-luz="amanecer"]{
  --puerta-1: rgba(255,146,104,.92);   /* el coral, alto y de frente */
  --puerta-2: rgba(255,201,120,.72);
  --puerta-3: rgba(150,116,255,.78);
  --puerta-4: rgba(64,226,198,.50);
}
html[data-luz="dia"]{
  --puerta-1: rgba(120,226,208,.60);   /* la luz de la casa, alta y fría */
  --puerta-2: rgba(190,226,150,.40);
  --puerta-3: rgba(150,116,255,.52);
  --puerta-4: rgba(64,226,198,.46);
}
html[data-luz="tarde"]{
  --puerta-1: rgba(255,178,96,.78);    /* vuelve a caer, más ámbar que coral */
  --puerta-2: rgba(255,146,104,.58);
  --puerta-3: rgba(150,116,255,.64);
  --puerta-4: rgba(64,226,198,.38);
}
html[data-luz="noche"]{
  --puerta-1: rgba(76,150,176,.50);    /* casi nada arriba */
  --puerta-2: rgba(60,120,140,.34);
  --puerta-3: rgba(150,116,255,.74);   /* y Ali, que sigue despierta */
  --puerta-4: rgba(64,226,198,.30);
}
/* La tarjeta de la puerta: el cromo con alfa, para que la aurora se vea POR
   DEBAJO. Opaca la taparía justo donde más luz hay, y el degradado dejaría de
   ser el fondo de la pantalla para ser un marco alrededor de una caja. */
:root{ --puerta-caja: rgba(18,32,31,.86); }

/* ⚠️ EL VALOR POR DEFECTO NO ES UNA HORA, ES EL SEGURO: si `tema.js` no llegó a
   correr, la puerta tiene que verse igual de bien. Se queda con la tarde, que es
   la menos extrema de las cuatro. */
:root{
  --puerta-1: rgba(255,178,96,.78);
  --puerta-2: rgba(255,146,104,.58);
  --puerta-3: rgba(150,116,255,.64);
  --puerta-4: rgba(64,226,198,.38);
}

/* La burbuja de WhatsApp (Respuestas rápidas, 2026-09-28): imita el teléfono de
   la paciente, así que es la misma en los dos temas. */
:root{ --wa-fondo: #E7DED3; --wa-burbuja: #FFFFFF; --wa-tinta: #111B21; }